使用 AJAX 和 Codeigniter 获取数据？

Question

我正在尝试将数据提取到表中，但没有任何反应。

1. 没有表格出现
2. 未获取任何数据

控制器

  public function indexajax()
      {
        if($this->input->post("action")=='FetchAllUserUingAjax')
        {
            $this->load->model("usersmodel");
            $data["allu"]=$this->usersmodel->ShowAllUsers("users");
            $data['pagetitle']=" -->All Users Using Ajax<--";

           foreach ($allu as $a):
            echo'<tr>
            <td>'.$a->id.'</td>
            <td>'.$a->username.'</td>
            </tr>';
            endforeach;



            $this->load->view("template/admin/header",$data);
            $this->load->view("users/allusersusingajax",$data);

            $this->load->view("template/admin/footer");
        }



      }

jQuery

 <script>

        $(document).ready(function () {


            FetchAllUserUingAjax();
            function FetchAllUserUingAjax() {

                $.ajax({
                    url:'<?php echo base_url()?>Users/indexajax',
                    method:"post",
                    success:function (data) {
                        $(".userdataajax table").append(data);

                    }
                })
                var action="FetchAllUserUingAjax";
                $.ajax({
                    url:"<?php echo base_url()?>Users/indexajax",

                    method:"post",
                    data:{action:action},
                    success:function (data) {
                        $(".userdataajax table tr ").not("table tr:first").remove();
                        $(".userdataajax table").append(data);
                        Table();


                    }
                })

            }



        })

    </script>

模型

public function ShowAllUsers()
        {


            $sql=$this->db->get("users");
            return $sql->result();

        }

看法

<div class="userdataajax table-responsive">
    <table class=" table table-responsive table-bordered">
        <tr>
            <th>#</th>
            <th>name</th>
            <th>image</th>
            <th> full name</th>
            <th>email</th>
            <th>usertype</th>
            <th>status</th>
            <th>reg date</th>
            <th>reg time</th>
            <th>delete</th>
            <th>edit</th>
            <th>Activate</th>
            <th>disactivate</th>

        </tr>




    </table>
</div>

Answer 1

您的代码会提示未显示的其他相关代码。 我把你展示的东西当作所有需要知道的东西。 这是我基于这个前提所看到的。

第一，观点。 向表中添加一个id 。 它使 JQuery 选择器变得如此简单。 JavaScript 位于“users/allusersusingajax.php”文件中。

<div class="userdataajax table-responsive">
    <table id='user-table' class=" table table-responsive table-bordered">
        <tr>
            <th>#</th>
            <th>name</th>
            <th>image</th>
            <th> full name</th>
            <th>email</th>
            <th>usertype</th>
            <th>status</th>
            <th>reg date</th>
            <th>reg time</th>
            <th>delete</th>
            <th>edit</th>
            <th>Activate</th>
            <th>disactivate</th>
        </tr>
    </table>
</div>

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

        function FetchAllViaAjax() {
            $.ajax({
                url: '<?= base_url("users/get_all_users") ?>',
                method: "post",
                dataType: 'html',
                success: function (data) {
                    var table = $("#user-table");
                    table.not("table tr:first").remove();//your code makes it unclear why you need this 
                    table.append(data);
                }
            });

            FetchAllViaAjax();
        }
    });

</script>

控制器需要两种方法。 一个显示表格，另一个显示行。 这是文件 Users.php

//show the page which includes the basic <table> and header row
public function indexajax()
{
    // The code and question text give no reason for this conditional test 
    // So I'm removing it
    //if($this->input->post("action") == 'FetchAllUserUingAjax')
    //{
    $data['pagetitle'] = "-->All Users Using Ajax<--";
    $this->load->view("template/admin/header", $data);
    $this->load->view("users/allusersusingajax");
    $this->load->view("template/admin/footer");
    //}
}

//respond to ajax request
public function get_all_users()
{
    $this->load->model("usersmodel");
    $allu = $this->usersmodel->ShowAllUsers("users");

    $out = ''; //if the model returned an empty array we still have a string to echo
    //using PHP's output buffer to simplify creating a big string of html
    ob_start(); //start output buffering
    foreach($allu as $a):
        ?>
        <tr><td><?= $a->id; ?></td><td><?= $a->username; ?></td></tr>
        <?php
    endforeach;
    $out .= ob_get_clean(); //append the output buffer to the $out string
    echo $out;
}

阅读 PHP 的输出控制函数

Answer 2

我首先更新我的模型以返回一个数组：

return $sql->result_array();

然后在您的控制器中，您不需要加载视图：

 public function indexajax()
 {
    if($this->input->post("action")=='FetchAllUserUingAjax')
    {
        //set content type
        header("Content-type: application/json");

        $this->load->model("usersmodel");

        echo json_encode(
            $this->usersmodel->ShowAllUsers(); //this method doesn't expect an argument, no need to pass one
        );

    }
  }

然后在你的 ajax 回调中：

success: function(resp){
   $.each(resp, function(k,v){
      console.log(v); 
   });  
}