带有下拉列表和文本框的jquery数据表头过滤器

时间:2016-07-16 06:38:19

标签: jquery asp.net json ajax datatables

我想用文本框和下拉列表显示标题过滤器。我设法为所有列应用带下拉列表的过滤器。但我希望前两列成为文本框过滤器,其他列应该是下拉列表。下面是我的代码,该过滤器包含所有列的下拉列表。

function GetData() {
        $.ajax({
            type: "POST",
            url: "JqueryDatatable.aspx/GetDataToDatatable",
            data: {},
            contentType: "application/json; charset=utf-8",
            success: function (data, textStatus) {
                if (textStatus == "success") {
                  var dataTableInstance = $("#datatable").DataTable
                    ({
                        data: jQuery.parseJSON(data.d),
                        columns: [
                            { 'data': 'CustID' },
                             { 'data': 'CompName' },
                             { 'data': 'ContactName' },
                              { 'data': 'PostalCode' },
                               { 'data': 'Address' },

                            { 'data': 'City' },
                             { 'data': 'Country' },

                        ]
                    });


                    //for showing dropdownlist in header

                  dataTableInstance.columns().every(function () {
                      var column = this;
                      var select = $('<select><option value=""></option></select>')
                          .appendTo($(column.header()).empty())
                          .on('change', function () {
                              var val = $.fn.dataTable.util.escapeRegex(
                                  $(this).val()
                              );

                              column.search(val ? '^' + val + '$' : '', true, false)
                                  .draw();
                          });




                      column.data().unique().sort().each(function (d, j) {
                          select.append('<option value="' + d + '">' + d + '</option>')
                      });

                  });

                }
                else {//
                    alert('An error has occured retrieving data!');
                }

            },
            error: function (data, textStatus) {
                alert('Error while calling the server!');
                //  EndRequest();
            }
        });
    }

任何人都可以帮我添加文件框和下拉列表中的过滤器。 感谢

0 个答案:

没有答案