在每次按鈕單擊ajax調用后如何刷新表

Question

我想通過單擊搜索按鈕在表中顯示數據。 我面臨的問題是，如果在“ Fromdate-Todate”之間沒有數據，錯誤將正確地出現，但是現在在此之后，我輸入了正確的fromdate和todate，則表中未顯示任何內容。 我檢查了Chrome控制台數據是否來自后端，但未顯示在表格中

 $('#paymentdetails').click(function() { var getData = basePath + 'Admin/GetPaymentsForDate/?FromDate=' + $(".datepickerInputFROM").val() + '&ToDate=' + $(".datepickerInputTO").val() if (($(".datepickerInputFROM").val() == "") && ($(".datepickerInputTO").val() == "")) { alertify.alert('Please select dates to proceed.') return false; //$('#financetbl').html(''); } else if (($(".datepickerInputFROM").val() == "") || ($(".datepickerInputTO").val() == "")) { alertify.alert('Please select dates to proceed.') return false; //$('#financetbl').html(''); } $.ajax({ url: getData, async: true, success: function(response) { // alert(response[0]); $('#financetbl').html(''); // if (response.resultCourse != '' && response[0]!= 'null') { if (response.length > 0) { var tr; for (var i = 0; i < response.length; i++) { tr = '<tr>' tr += "<td>" + response[i].applicationNumber + "</td>"; tr += "<td>" + response[i].applicantName + "</td>" tr += '</tr>' $('#financetbl tbody').append(tr); } inittable(); console.log(response) } else { console.log(response) alertify.alert("Error : No Payments Details Found"); //flush the table $('#financetbl').html('No Payments Details Found'); } } }); }); 

Answer 1

我相信執行時：

$('#financetbl').html('');

然后，tbody消失了，您會失去以下選擇器：

$('#financetbl tbody').append(tr);

我認為第一行應該是：

$('#financetbl tbody').empty();

Answer 2

更改

    $('#financetbl').html('No Payments Details Found');

至

    $('#financetbl').html('<tr><td colspan="2">No Payments Details Found</td></tr>');

Answer 3

您有過多的if語句，並且在返回的結果為空時需要正確管理表。 因此，我們將其放在一個空表行中。

不知道什么是inittable(); 這樣做，您可能必須解決此問題。

$('#paymentdetails').on('click', function() {
  if (($(".datepickerInputFROM").val() == "") || ($(".datepickerInputTO").val() == "")) {
    alertify.alert('Please select dates to proceed.')
    return false;
  }
  var getData = basePath + 'Admin/GetPaymentsForDate/?FromDate=' + $(".datepickerInputFROM").val() + '&ToDate=' + $(".datepickerInputTO").val();
  $.ajax({
    url: getData,
    async: true,
    success: function(response) {
      $('#financetbl').find('tbody').html('');
      if (response.length > 0) {
        var tr;
        for (var i = 0; i < response.length; i++) {
          tr = '<tr>'
          tr += "<td>" + response[i].applicationNumber + "</td>";
          tr += "<td>" + response[i].applicantName + "</td>"
          tr += '</tr>'
          $('#financetbl tbody').append(tr);
        }
        inittable();
        console.log(response);
      } else {
        console.log(response);
        alertify.alert("Error : No Payments Details Found");
        //flush the table
        $('#financetbl').find('tbody').html('<tr><td>No Payments Details Found</td></tr>');
      }
    }
  });
});

Answer 4

嘗試類似JSON.parse（）的方法

var json = '{"applicationName":"XYZ","applicationNumber":1}',
obj = JSON.parse(json);

alert(obj.applicationName);

要么

var json = '{"applicationName":"XYZ","applicationNumber":1}',
obj = JSON && JSON.parse(json) || $.parseJSON(json);