当数据存在时,隐藏“表中没有可用数据”消息

时间:2015-05-15 10:22:54

标签: javascript jquery html

这是我的表,我使用json获取数据列表并填充此表,

<table id="tblClaimSearch" class="display responsive nowrap" cellspacing="0" width="100%">
    <thead>
       <tr>
          <th><input type="checkbox" id="ChkboxClaimHeader" name="ChkboxClaimHeader" value="false"></th>
          <th>Claim #</th>
          <th>Client Name</th>
          <th>Amount</th>
          <th>Deduction</th>
          <th>Type</th>
          <th>Status</th>
       </tr>
    </thead>
    <tbody>                      

    </tbody>
 </table> 

我的jquery有Json结果,我得到结果并根据我的数据将行附加到表体,

$(document).ready(function () {
$.ajax({
            url: '@Url.Action("ClaimResultTest", "Claims")',
            data: { seacrhClaimNumber: claimNumberToBeSearched },
            type: 'POST',
            success: function (data) {
                   var dataClaims = data.Claims;//This has the complete list
                   for (i = 0; i < dataClaims.length; i++) {
                    alert(dataClaims[i].ClaimNumber);
                    $("#tblClaimSearch").find('tbody')
                            .append($('<tr>')
                            .append($('<td><input type="checkbox">'))
                            .append($('<td>').text(dataClaims[i].ClaimNumber))
                            .append($('<td>').text(dataClaims[i].Client))
                            .append($('<td>').text(dataClaims[i].Amount))
                            .append($('<td>').text(dataClaims[i].Deduction))
                            .append($('<td>').text(dataClaims[i].Type))
                            .append($('<td>').text(dataClaims[i].Status))
                                )
                     }
                  }
              });
        });

问题是当没有数据时,我有一行显示“表格中没有可用数据”..即使有附加数据,我仍然有第一行“表格中没有数据”..怎么做当添加了带有数据的新行时,我隐藏了这条消息行。其次,即使我有16个条目,它仍然显示“显示0个条目中的0个”?。我做错了什么?...

1 个答案:

答案 0 :(得分:4)

试试这个: -

$(document).ready(function () {
 $.ajax({
        url: '@Url.Action("ClaimResultTest", "Claims")',
        data: { seacrhClaimNumber: claimNumberToBeSearched },
        type: 'POST',
        success: function (data) {


                 $("#tblClaimSearch").find('tbody').empty(); //add this line

               var dataClaims = data.Claims;//This has the complete list
               for (i = 0; i < dataClaims.length; i++) {
                alert(dataClaims[i].ClaimNumber);
                $("#tblClaimSearch").find('tbody')
                        .append($('<tr>')
                        .append($('<td><input type="checkbox">'))
                        .append($('<td>').text(dataClaims[i].ClaimNumber))
                        .append($('<td>').text(dataClaims[i].Client))
                        .append($('<td>').text(dataClaims[i].Amount))
                        .append($('<td>').text(dataClaims[i].Deduction))
                        .append($('<td>').text(dataClaims[i].Type))
                        .append($('<td>').text(dataClaims[i].Status))
                            )
                 }
              }
          });
    });