在不刷新页面的情况下如何使用ajax/jQuery显示数据库中的值

2024-04-24

通过jQuery/ajax将数据插入数据库后,同时从数据库获取值而不刷新页面如何使用codeigniter显示数据库值?

这是我的代码:

Script:

 <script>
        $(document).ready(function(){
            $("#personal-info").submit(function(e){
               e.preventDefault();
               var suppid = $("#suppid").val();
               var proid = $("#proid").val();
               var custid = $("#custid").val();
                var message = $("#message").val();

                $.ajax({
                    type: "POST",
                    url: "<?php echo base_url(); ?>index.php/Profile_cntrl/buyer_communication",
                    data: {suppid:suppid,proid:proid,custid:custid,message:message},
                    success:function(data)
                    {
                        alert('SUCCESS!!');
                    },
                    error:function()
                    {
                        alert('fail');
                    }
                });
            });
        });
    </script>

控制器:

public function buyer_communication() {

        $result1 = $this->Profile_model->fetch_Data($product_id);


        $Userid = $this->session->userdata('id');
        $result3 = $this->session->userdata('tt');
        $data4 = array(
            'message' => $this->input->post('message'),
            'supplier_id' => $this->input->post('suppid'),
            'product_id' => $this->input->post('proid'),
            'Customer_id' => $this->input->post('custid'),
            'From' => $result3,
        );

        $this->Profile_model->buyer_insert($data4);

        redirect('welcome/buyermessageview?id=' . $product_id);
    }

Model:

function buyer_insert($data4) {
        $this->db->insert('communication', $data4);
        return ($this->db->affected_rows() != 1) ? false : true;
    }

Form:

<form class="form-horizontal" method="POST" id="personal-info"  role="form" action="#"> 
                            <div class="panel-footer">
                                <div class="input-group">

                                    <input type ="hidden" name="suppid" id="suppid" value="<?php echo $row->supplier_id; ?>" class="form-control" />
                                    <input type ="hidden" name="proid" id="proid" value="<?php echo $row->product_id; ?>" class="form-control" />
                                    <input type ="hidden" name="custid" id="custid" value="<?php echo $row->Customer_id; ?>" class="form-control" />



                                    <input id="message" name="message" type="text" class="form-control input-sm chat_input" placeholder="Write your message here..." />
                                    <span class="input-group-btn">
                                        <button class="btn btn-primary btn-sm" id="submit-p" name="submit-p">Send</button>
                                        <!--<input type="submit" name="submit-p" id="submit-p" value="send" class="btn btn-primary btn-sm" >-->
                                    </span>
                                </div>
                            </div>
                        </form>

@Maruthi Prasad 这是代码.. [IN CODEIGNITER]

使用 jquery 脚本查看 HTML 代码 视图\profile_view.php

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <div class="row">
    <div class="col-md-6">
      <div id="load_data">

      </div>

      <form method="post" id="personal-info">
            <input id="message" name="message" type="text" class="form-control input-sm chat_input" placeholder="Write your message here..." />
            <button type="submit" class="btn btn-primary btn-sm" id="submit-p" name="submit-p">Send</button>
      </form>
    </div>
  </div>
</div>


<script>
$(document).ready(function(){
    loaddata();

    data_submit();
});

function loaddata(){
    $.getJSON('<?php echo base_url();?>'+'index.php/Profile_cntrl/get_data',function(data){
        for(var i in data){
            var show = '<div>';
            show += '<h5 style="background:#ccc;padding:10px;border-radius:10px;">'+data[i].message+'</h5>';
            show += '</div>';

            $("#load_data").append(show);
        }
    });
}

function data_submit(){
    $("#personal-info").submit(function(e){
        e.preventDefault();

        var formdata = $(this).serialize();

        $.ajax({
            type:'POST',
            url:'<?php echo base_url();?>'+'index.php/Profile_cntrl/insert_data',
            data:formdata,
            success:function(data){
                var res = JSON.parse(data);

                if(res.Status == 'true'){
                    //console.log(res.report);
                    $("#load_data").empty();
                    loaddata()
                }else{
                    alert(res.report);
                }
            }
        }); 
    });
}
</script>
</body>
</html>

控制器代码: 控制器\Profile_cntrl.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
header('Access-Control-Allow-Origin: *');
class Profile_cntrl extends CI_Controller {
    function __construct(){
        parent::__construct();

        $this->load->model('profile_model');
        $this->load->helper(array('url','html','form'));
    }


    public function index()
    {
        $this->load->view('profile_view');
    }

    public function get_data(){
        $query = $this->profile_model->buyer_communication();

        echo json_encode($query);
    }

    public function insert_data(){
        $arr = array(
            'message'=>$this->input->post('message')
        );

        $sql = $this->profile_model->buyer_insert($arr);

        $op = "data insert id :".$this->db->insert_id();

        if($sql == true){
            $reponse = array(
                'Status'=>'true',
                'report'=>$op
            );
            echo json_encode($reponse);
        }
        else
        {
            $op = "Failed to insert data";

            $reponse = array(
                'Status'=>'false',
                'report'=>$op
            );
            echo json_encode($reponse);
        }
    }
}
?>

型号代码: 模型\Profile_model.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Profile_model extends CI_model {

    public function buyer_communication(){
        $sql = $this->db->get('communication');
        $sql = $sql->result_array();
        return $sql;
    }

    public function buyer_insert($arr){
        return $query = $this->db->insert('communication',$arr);
    }
}
?>

随意问的问题

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在不刷新页面的情况下如何使用ajax/jQuery显示数据库中的值 的相关文章

  • 如何使用 JqGrid 子网格进行内联编辑?

    我知道如何使用主网格进行内联编辑 但是有没有办法对子网格进行内联编辑 这是我的 JS 文件 function var lastsel list jqGrid url example php postData q 1 datatype jso
  • PHP json_encode 将多个数组编码为一个对象

    我试图在一个 JSON 对象中返回多个数组 但在语法上遇到一些困难 一款 Android 应用程序从多个表接收更新 我希望在一个响应中返回这些更新 目前 这就是我对各种结果集进行编码的方式 json json encode array ta
  • PHP 使用 use 关键字导入类

    到目前为止我还没有使用PHPuse词 但现在必须 索引 php内容 require once Classes MainClass php obj new Main echo obj gt test 类 MainClass php
  • PHP 和 ASP.Net 可以在 IIS 7.5 中的同一网站中一起运行吗?

    我们网站的一部分是用 PHP 完成的 而我们网站的一部分是用 ASP Net 完成的 我们刚刚使用 Windows Server 2008 R2 设置了一个新的 Web 服务器 其中安装了 IIS 7 5 我知道 IIS 7 支持 PHP
  • 如何设置外键id的id #sf2 #doctrine2

    我正在尝试手动为对象设置外键 id 但没有找到如何执行此操作 class Item ORM ManyToOne targetEntity MyBundle Entity ItemType inversedBy itemTypes ORM J
  • 表单未使用 AJAX 提交

    再次更新 如果有人关心的话 我之前发布的解决方案由于某种原因停止工作 我在 ajax 请求中包含了 beforeSend 并将验证表单的 js 部分粘贴到其中 现在就像一个魅力 form on submit function e e pre
  • jquery/javascript 处理后移至命名锚点

    在进行一些 jquery 处理后 如何将焦点移动到同一页面上的不同部分 名为锚点 函数 ABC 进行一些处理 然后 我需要将用户移动到同一页面上的某个部分 页面下方 您可以使用下面的代码将屏幕滚动到 div 只需更改选择器以匹配您要滚动到的
  • 如何使用text()函数插入html文本? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我需要更改包含 html 的元素的内容 我尝试过这个 但是 html 标签被打印了 content sections label text
  • KineticJS - 将舞台缩放到视口

    我正在努力将默认分辨率设置为 1366x756 我会根据视口来放大和缩小它 类似于此处显示的示例 http blogs msdn com b davrous archive 2012 04 06 modernizing your html5
  • jQuery 选择器可以应用于一个元素而不是整个文档吗?

    jQuery td class bgoff each function var td jQuery this no apply selector to this only 我正在处理 html 中的表格数据并尝试解析每个 TD 的内容 它们
  • 任何人都知道 JQuery 插件可以生成类似于 geni.com 上的树形菜单

    大家好 我花了几个小时寻找一个 Jquery 插件来生成像 geni com 上那样的树形菜单模块 如果有人知道 Jquery 中的这样的插件或脚本 请让我知道或指导我如何使用 Jquery 开发这样的功能 请检查我正在寻找什么http w
  • 如何滚动到 jQuery Mobile 中的页面元素?

    我有一个很长的 jQuery 移动页面 并且想在页面加载后滚动到该页面中间的元素 到目前为止 我已经尝试了一些事情 最成功的是 jQuery document bind mobileinit function var target if t
  • 日期时间的自定义 JavaScriptConverter?

    我有一个对象 它有一个 DateTime 属性 我想通过 AJAX JSON 将该对象从 ashx 处理程序传递回网页 我不想使用第 3 方控件 当我这样做时 new JavaScriptSerializer Serialize DateT
  • 如何在流程图中间隔刻度线?

    我下面有一个流程图 您将看到标签被压缩 我想使刻度之间的宽度确保显示所有标签 标记如下 div div class graph info a href span span a a href class active span span a
  • PHP strtotime返回Mysql UNIX_TIMESTAMP的不同值

    我在 stackoverflow 上搜索过帖子 发现了一些类似的帖子 但我认为这是一篇不同的帖子 我的 PHP 和 Mysql 服务器的时区全部设置为 UTC 在表中我使用时间戳字段 值为 2010 11 08 02 54 15 我使用这样
  • 使用后代选择器的响应式网站

    我试图使用媒体查询使我的网站响应 但是当我在代码的某些部分使用后代选择器时 页面没有响应 当我使用此代码时 该页面是响应式的 div1 float left width 20 height 200px background color re
  • JQuery 表单提交不发送帖子

    我在使用 JQuery 提交表单时遇到问题 当按下提交按钮时 表单会正确提交 但是当我尝试使用时 somebutton click function form myForm submit 我还尝试从 Chrome 控制台调用表单提交 表单未
  • Safari 的 Javascript 与 document.write 的问题

    我的问题只发生在 Safari 上 IE FF Chrome 和 Opera 都可以完美运行 我正在向 DOM 添加一个对象 与 YouTube 的方式完全相同 具体取决于 ActiveX 或 NPAPI 因此在确定写入对象类型后 我通过以
  • PDO 返回不正确但重复的数据。密钥不在数据库中。

    我刚开始使用 pdo 语句 所以可能是一些简单的东西 我还没有在 php net 上读过 查询数据库时我收到重复的结果 Result 0 gt Array umeta id gt 31 0 gt 31 user id gt 2 1 gt 2
  • 截断段落前 100 个字符并隐藏段落的其余内容,以通过更多/更少链接显示/隐藏其余内容

    我有一个超过 500 个字符的段落 我只想获取最初的 100 个字符并隐藏其余部分 我还想在 100 个字符旁边插入 更多 链接 单击更多链接时 整个段落应显示并编辑文本 更多 到 更少 单击 更少 时 它应切换行为 段落是动态生成的 我无

随机推荐