如何以数据表的形式在模式中附加ajax结果 [英] How to append ajax result in modal with datatable

查看:80
本文介绍了如何以数据表的形式在模式中附加ajax结果的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

大家好!我试图将我的ajax结果附加到模态中的数据表中.我已经获得了所需的数据,但仍然显示数据不可用.

Good day everyone! I am trying to append my ajax result in my datatable inside my modal. I already get the data that I needed but it still shows that data is not available.

它显示如下:

这是我的ajax成功处理了结果.

This is my ajax success which processed the result.

    success: function(result)
    { 
      //console.log(result);
      //$('#viewTable').empty();
      $.each(result, function(index, value){
        console.log(value);

        $('#viewTable').append(
         '<tbody>' + 
             '<tr>' +
                '<td>' + value.qr_code + '</td>' +
                '<td>' + value.reference_no + '</td>' +
                '<td>' + value.brand_name + '</td>' +
                '<td>' + value.model_name + '</td>' +
                '<td>' + value.unitPrice + '</td>' +
             '</tr>' +
          '</tbody>'
          );
      });

这是我的HTML

        <table id="viewTable" class="table table-striped">
          <thead>
            <tr>
              <th>Barcode</th>
              <th>Reference Number</th>
              <th>Brand Name</th>
              <th>Model Name</th>
              <th>Unit Price</th>
            </tr>
          </thead>
        </table>

注意:当我取消注释"$('#viewTable').empty();"时,函数将删除我的thead(数据表).

Note: When I uncomment the "$('#viewTable').empty();" function it will remove my thead (Datatable).

谢谢!

推荐答案

首先将dataTable对象存储在变量中,

First store the dataTable object in a variable,

var dataTable = $("#viewTable").DataTable();

然后在ajax成功后,使用dataTable.add([",", "]).draw(),其中dataTable是变量名.

Then on ajax success, use dataTable.add([" "," ", " "]).draw(), wherein dataTable is the variable name.

要清除数据表,请使用dataTable.clear();

dataTable.clear().draw();

请参见下面的代码;

success: function(result) {
  // store your data table object in a variable
  var dataTable = $("#viewTable").DataTable();
  /////////////////////////////////////////////
  dataTable.clear().draw();

  $.each(result, function(index, value) {
    console.log(value);

    // use data table row.add, then .draw for table refresh
    dataTable.row.Add([value.qr_code, value.reference_no, value.brand_name, value.model_name, value.unitPrice]).draw();
  });
}

这篇关于如何以数据表的形式在模式中附加ajax结果的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆