Codeigniter：AJAX调用后返回JSON数据，但无法成功运行：function（）

Question

我的阿贾克斯

 // Load category function function load_category() { $.ajax({ url: "<?php echo base_url() ?>index.php/admin/departments", type: "GET", dataType: 'json', success: function(data){ $('#category-row').html(data); }, error: function(){ alert('Error....'); } }); } // Fix tooltip not work $('body').tooltip({ selector: '[data-toggle="tooltip"]' }); }); 

我的桌子

我要在这里回显该数据...

 <div class="row"> <div class="col-sm-12"> <div class="card-box table-responsive"> <table id="datatable-responsive" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%"> <thead> <tr> <th>Dep't Name</th> <th>Description</th> <th>Consultancy Amount</th> <th>Doctor's Amount</th> <th>Manage Department</th> </tr> </thead> <tbody id="category-row"> </tbody> </table> </div> </div><!-- end col --> </div> <!-- end row --> 

现在我的Contoller

管理员/部门

 public function departments()
{

    $table ='';

    $departments = $this->admin_model->departments();

    if(count($departments)>0)
    {
      foreach ($departments as $dept)
      {
        $table.='<tr id="row-id-'.$dept->Dept_id.'">';
        $table.='<td>'.$dept->Dept_name.'</td>';
        $table.='<td>'.$dept->Description.'</td>';
        $table.='<td>'.$dept->Consultancy_amount.'</td>';
        $table.='<td>'.$dept->Doctor_Percentage.'</td>';
        $table.='<td>';
        $table.='<a href="#" data-toggle="modal" data-target="#myModalUpdate"><i class="glyphicon glyphicon-edit" data-toggle="tooltip" title="EDIT DEPARTMENT"></i></a> |';
        $table.='<a href="#" data-toggle="modal" data-target="#myModalDelete"><i class="glyphicon glyphicon-trash" data-toggle="tooltip" title="DELETE DEPARTMENT"></i></a>';
    $table.='</td>';
    $table.='</tr>';
      }
      echo json_encode($table);     
   }
}

实际发生的是使用load_category（）函数打开窗口。 但是，当我访问它时，它作为JSON如下所示

"ENT<\/td>Ear, Nose and Throat<\/td>30000<\/td>40<\/td><\/i><\/a> |<\/i><\/a><\/td><\/tr>Cancer<\/td>Cancer<\/td>100000<\/td>50<\/td><\/i><\/a> |<\/i><\/a><\/td><\/tr>ENT<\/td>Ear<\/td>40000<\/td>34<\/td><\/i><\/a> |<\/i><\/a><\/td><\/tr>"

我完全困惑为什么它无法运行成功功能并将数据回显到我想要的位置。

非常感谢你

Answer 1

我不确定您是否要在表主体（ $('#category-row').html(data); ）上执行.html（）输出，因此这可能就是问题所在。 如果您想添加行，我认为您需要进行追加。

$("#category-row").append(data);

另外，我可能会建议使用另一种解析数据的方法。 我将通过json_encode返回整个$departments结果，然后在成功函数中进行解析，例如下面的示例。 在该示例中，我还更改了控制器的count用法， 如果不为空 ， 则继续使用（ !empty($departments) ）。

控制器功能：

public function departments()
{
    $departments = $this->admin_model->departments();

    if(!empty($departments)) {
        echo json_encode($departments);     
    }
}

jQuery“成功”调整：

success: function(data){
    var tableRows = '';

    $.each(data, function(index, dept) {

        tableRows = tableRows + '<tr id="row-id-' + dept.Dept_id + '"><td>' + dept.Dept_name + '</td><td>' + dept.Description + '</td><td>' + dept.Consultancy_amount + '</td><td>' + dept.Doctor_Percentage + '</td><td><a href="#" data-toggle="modal" data-target="#myModalUpdate"><i class="glyphicon glyphicon-edit" data-toggle="tooltip" title="EDIT DEPARTMENT"></i></a> | <a href="#" data-toggle="modal" data-target="#myModalDelete"><i class="glyphicon glyphicon-trash" data-toggle="tooltip" title="DELETE DEPARTMENT"></i></a></td>/tr>';

    });

    $("#category-row").append(tableRows);
}

更多的思考...如果您想测试成功的根源，请发出一个简单的警报（“成功”）； 或console.log（'success'）那里，看看它是否启动。 也许您的查询为空。

无论如何，希望这会有所帮助。

Answer 2

整个问题是我在底部而不是顶部加载了JQuery。 这使我无法使用它。

我得出的结论是，如果ypu在底部直接加载jquery，请使用以下命令：

 (function($) {

//All your functions go here. Be it Ajax!

        }(jQuery));

谢谢