Горизонтальная полоса прокрутки для ajax datatable - PullRequest
0 голосов
/ 02 января 2019

Как добавить горизонтальную полосу прокрутки в Datatable AJAX? Я пытался использовать "ScrollX": правда, но он не работает.

$(document).ready(function () {
    $('#myDataTable1').DataTable({       
        "ajax": {
            "dataType": 'json',
            "type": "GET",
            "url": "/DisplayUserProfile",  
            },

        "columns": [
            { "data": "PK_UserProfile" },
            { "data": "UserName" },

        ]
    });
});

Ответы [ 2 ]

0 голосов
/ 02 января 2019

Использование параметра scrollX должно решить проблему.https://datatables.net/reference/option/scrollX

$(document).ready(function () {
    $('#myDataTable1').DataTable({       
        "ajax": {
            "dataType": 'json',
            "type": "GET",
            "url": "/DisplayUserProfile",  
        },
        "columns": [
            { "data": "PK_UserProfile" },
            { "data": "UserName" },

        ],
        "scrollX": true
    });
});
0 голосов
/ 02 января 2019

Это должно решить вашу проблему:

$(document).ready(function() {
    $('#myDataTable1').DataTable( {
        "scrollX": true,
        "ajax": {
            "dataType": 'json',
            "type": "GET",
            "url": "/DisplayUserProfile",  
            },

        "columns": [
            { "data": "PK_UserProfile" },
            { "data": "UserName" },

        ]
    } );
} );

Обновление Я думаю, что проблема с запросом ajax, поэтому вы должны добавить scrollX после вызова ajax. Таким образом, вы можете использовать датируемые события, чтобы заставить его работать:

$(document).ready(function() {

   var s= $('#example').DataTable( {
        "ajax": 'https://www.mocky.io/v2/5c2cd0ec2e0000de52e877a1',

} );


s.one( 'draw', function () {
   $('#example').DataTable({
       destroy: true,
       "scrollX": true
    });
} );


} );

jsFiddle здесь

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...