CakePhp 使用 ajax 和 jquery 加载表格内容答案

【问题标题】：CakePhp Load table content using ajax and jqueryCakePhp 使用 ajax 和 jquery 加载表格内容
【发布时间】：2017-04-07 10:20:41
【问题描述】：

我有一个空表，当我从我的选择元素中选择一个选项时，我会提供新行

<table id="table" align="right" class ="table table-striped table-bordered">
    </table>

这是我的 ajax 函数，看起来没问题，但除了标题我没有行。当我打印错误时，我得到“parsererror”

<script>
      document.getElementById("encaissements").style.visibility = "hidden";


        function loadTransactions (trainer) {
        document.getElementById("encaissements").style.visibility = "visible";
        var trainer = trainer;
        var trHTML = '';
        var headHTML = '<tr><th>' +"Numéro de la facture" + '</th><th>' + 
        "Montant " + '</th><th>' + 
        "Date du réglement  " + '</th><th>' + 
        "Réglée par " + '</th></tr>';

        $('#table').empty(); 
        $('#table').append(headHTML);
        $.ajax({
            type: "POST",
            url: "/icicpermis/trainers/getTransactions/"+trainer,
            data:  {'trainer': trainer },
            dataType: 'json',
            success: function(response){
              //console.log(response);
              $.each(response, function(i,value) {
              console.log(value);
              trHTML = '<tr><td>' + value.date + '</td><td>' + value.price + '</td></tr>';
              $('#table').append(trHTML);
              });
              //$('#table').append(trHTML);

             },
            error: function(x, error) {
              console.log(error );
            }
        });
        }
    </script>

【问题讨论】：

标签： jquery ajax cakephp load html-table

【解决方案1】：

我通过弯曲数组值解决了这个问题，它是一个数组而不是一个简单的 json 变量

success: function(response){

              $.each(response, function(i,value) {
              trHTML= '<tr>';

              trHTML+= '<td>' + indice + '</td>';
              $.each(value, function(j,value2) {
                trHTML+= '<td>' + value2 + '</td>';

              });
               trHTML+= '</tr>';
              $('#table').append(trHTML);
              indice++;
              });

             },

【讨论】：

【解决方案2】：

为什么不对表单字段的选择更改事件执行表单提交？您也可以使用 ajax，这一切都取决于您的实际情况。

另外，我还要在这里添加一个建议，即使用 jQuery 进行 DOM 选择或操作。它将简化您的工作流程并最大限度地减少代码行数。

【讨论】：