向 Jquery 中的数据表添加更多下拉列表或 html 元素

Question

是否可以在默认

之后向数据表添加更多下拉列表或其他 html 元素

显示“5”条记录

我想在默认设置和默认提供的搜索栏之间向我的 DataTable 添加更多下拉菜单。

我已经了解了 sDom，但我无法理解其语法。

提前致谢。

Answer 1

您可以这样在长度菜单和筛选框之间插入一个元素 <div> :

var table = $('#example').DataTable({
   dom : 'l<"#add">frtip'
})

'lfrtip' 是默认的 dom 字符串，因此您基本上只需将 <div id="#add"> 添加到现有布局即可。建议使用 #add 样式，尤其是将 display 类型设置为 inline-block，这样它就不会分解 :

下的元素

#add {
  display: inline-block;
  padding-left: 30px;
  float: left;
}

现在您可以将 <select>（或其他）添加到 #add 元素中，使用简单的 jQuery 方式：

//insert a label
$('<label/>').text('my dropdown').appendTo('#add')

//insert the select and some options
$select = $('<select/>').appendTo('#add')
$('<option/>').val('1').text('option #1').appendTo($select);
$('<option/>').val('2').text('option #2').appendTo($select);
$('<option/>').val('3').text('option #3').appendTo($select);

演示 -> http://jsfiddle.net/ahqbf35w/

向 Jquery 中的数据表添加更多下拉列表或 html 元素

Adding more drop down or html elements to Datatable in Jquery

datatable

datatables

datatables-1.10