Datatables - jQuery / Javascript下拉框包含空选择器

时间:2016-05-31 07:37:08

标签: javascript jquery datatables

我为我的数据表制作了一个下拉过滤器,正如你在jsfiddle(https://jsfiddle.net/6k0bshb6/45/)中看到的那样,有一个不包含数据的选项 - 如果你查看检查元素<option value=""></option>我该怎么办?删除这个空容器并告诉我的数据表函数下拉框在它们为空时跳过附加选项选项。

// Dropdown filter function for dataTable from hidden column number 5 for filtering gifts.
       initComplete: function () {
            this.api().columns(5).every(function () {
                var column = this;
                var select = $('<select><option value="">Show all</option></select>')
                    .appendTo($("#contracts_control-panel").find("div").eq(1)) // append dropdown to div 2 in control panel
                    .on('change', function () {
                    var val = $.fn.dataTable.util.escapeRegex(
                    $(this).val());
                    column.search(val ? '^' + val + '$' : '', true, false)
                        .draw();
                        dataTable.page.len(5).draw(); //reset pagination after dropdown filter change.
                });
                column.data().unique().sort().each(function (d, j) {
                    select.append('<option value="' + d + '">' + d + '</option>')
                });
            });
        }
    });

我尝试在这样的追加周围包装if语句......

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

但由于某种原因它没有用。

3 个答案:

答案 0 :(得分:1)

你可以像这样修改

$('#btnval').on('click', function() {
    var from = $('#from').val();
    var until = $('#until').val();
    console.log(from > until)
});

我发现有一行失去了它的价值,如下所示: enter image description here

答案 1 :(得分:1)

使用Network代替d !== ""。请参阅fiddle

d !== undefined

答案 2 :(得分:0)

您可以设置“全部显示”的值,如下所示。

<select><option value="Show All">Show all</option><option value=""></option><option value="Free Biscuits">Free Biscuits</option><option value="Free PS4">Free PS4</option><option value="Free TV">Free TV</option><option value="Free XBOX">Free XBOX</option></select>

一旦页面加载完成,您可以使用JQuery删除空下拉选项。以下选项根据索引

删除下拉项
$('.dropdown-filter-div option:eq(1)').remove()

或使用下面的JQuery,下面的代码根据值(代码中为空)删除下拉项目

$('.dropdown-filter-div option[value=""]').remove()

希望这有帮助。