css 如何更改数据表的位置长度菜单？

kgsdhlau 于 2023-01-27 发布在其他

关注(0)|答案(3)|浏览(106)

我可以将长度菜单移动到search part标签旁边吗？
我可以只使用CSS移动length吗？或者我们需要基本的dom，就像this discussion一样。我试过了，但是我不知道如何移动指定的位置

下面是我初始化datatables的代码：

table = $('#sparepart_id').DataTable({
        "paging": true,
        "stateSave": true,
        "pagingType": "full_numbers",
        "lengthChange": true,
        "searching": false,
        "ordering": true,
        "info": false,
        "autoWidth": false,
        "pageLength": 25,
        scrollX: true,
       stateLoadCallback: function (settings) {
         var o;
         $.ajax( {
            url     : BASE_URL+"spareparts/load_layout",
            type    : "POST",
            data    : { module_table : "sparepart-list"},
            async   : false,
            dataType: 'json',
             success: function (json) {
                 o = JSON.parse(json.json);
             },
             error:function(data){
                console.log(data);
             }
         } );
         return o;
     }

css

来源：https://stackoverflow.com/questions/52775014/how-to-change-position-length-menu-of-datatable

3条答案

按热度按时间

b5buobof1#

我的解决方案：
我只是检查元素并查看长度菜单datatable中的类，然后将css代码放入我的视图中

.dataTables_length{
        margin-top : -57px;
        margin-left: 20px;
       }

赞(0）回复(0）举报 2023-01-27

g0czyy6m2#

$(document).ready(function() {
$('#example').DataTable( {
    "dom": '<"top"i>rt<"bottom"flp><"clear">'
} );

赞(0）回复(0）举报 2023-01-27

k10s72fa3#

指定位置的移动应该使用dom属性。有一个示例可能会有帮助。

$('#example').DataTable( {
     "dom": '<"toolbox"l>rtip',
     //... your another config,
     "initComplete":function(){
          //build your search layout here
         $(".toolbox").append("<label>search part</label><input>");         
     }
} );

l表示Length changing功能，<"toolbox"l>将变为

<div class="toolbox">
    {Length changing}
    <label>search part</label><input>
</div>"

{Length changing}由DataTables构建，您不需要关心它。
更多信息：https://datatables.net/release-datatables/examples/basic_init/dom.html

赞(0）回复(0）举报 2023-01-27

我来回答

css 如何更改数据表的位置长度菜单？

3条答案

相关问题

热门标签

最新问答