数据表 jQuery Select

Question

我在 jQuery DataTables 中的选择有问题。第一页很好地加载了选择，但第二页没有。有时会加载它们，其他则不会

$.ajax({
  type: "POST",
  url: "Compensaciones.aspx/getTipoConceptoComp",
  data: "{p_IdTipoTributo: '" + $("#<%=ddlTipoTributo.ClientID %>").val() + "'}",
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function(data, st) {
    if (st == 'success') {
      if (data.d.length > 0) {
        dropdownlist = $('#Detalledet select').empty().append('<option selected="selected" value="0">SELECCIONE</option>')[i];
        $.each(data.d, function() {
          dropdownlist = $('#Detalledet select').append($("<option value=" + this['IDTIPOCONCEPTO'] + "></option>").val(this['IDTIPOCONCEPTO']).html( /*this['CONCEPTO'] + " - " + */ this['DESCRIPCION'] + "  " + this['IMPACTO']))[i];
        });
      } else {
        dropdownlist = $('#Detalledet select').empty().append('<option selected="selected" value="0">Not available<option>')[i];
      }
    }
  },
  failure: function(data) {
    alert(data.d);
  }
});

Answer 1

我假设问题出在发送的对象上，所以我创建了一个名为 mydata 的对象。然后使用 .ajax 的承诺形式创建一个本地数组，然后只用它点击一次 DOM。

不需要 .empty()，因为无论哪种方式我们都将其替换为 .html()
将选定的下拉菜单 list/select 缓存在 let dropdownlist = $('#Detalledet select'); 中，这样我们就可以对其进行操作而无需多次点击 DOM 来获取它
将新选项推送到数组（执行此操作的几种方法）
完成后追加数组命中 DOM 一次而不是每个循环
警告：由于没有提供示例，我没有花时间用一组实际数据对此进行测试

let mydata = {
  p_IdTipoTributo: $("#<%=ddlTipoTributo.ClientID %>").val()
};
.ajax({
    type: "POST",
    url: "Compensaciones.aspx/getTipoConceptoComp",
    data: mydata,
    contentType: "application/json; charset=utf-8",
    dataType: "json"
  })
  .done(function(data) {
      let dropdownlist = $('#Detalledet select');
      if (data.d.length > 0) {
        let newOptions = [];
        .push($('<option selected="selected">', {
            value: 0
          })
          .text("SELECCIONE"));
        $.map(data.d, function(n, i) {
          options.push($('<option>', {
              value: n['IDTIPOCONCEPTO']
            })
            .text(n['DESCRIPCION'] + "  " + , n['IMPACTO']));
        });
        dropdownlist.html(newOptions);
      } else {
        dropdownlist.html('<option selected="selected" value="0">Not available</option>');
      }
    }
  })
.fail(function(data) {
  alert(data.d);
});

Answer 2

我能够通过调用 table 的 drawcallback 中的函数来解决它，感谢所有不厌其烦回答的人

数据表 jQuery Select

Datatables jQuery Select

datatable

jquery

jquery-datatables-editor