О настройке таблицы данных - PullRequest
0 голосов
/ 30 января 2020

У меня есть какое-то странное требование:

1.Только 5 записей для загрузки по умолчанию на мобильный сайт с разбитыми на страницы данными для загрузки на последующих страницах.

и

2. В режиме просмотра рабочего стола по умолчанию загружается 10 записей с разбитыми на страницы данными для загрузки на последующих страницах.

Мобильный сайт не имеет формата «m». Так есть ли способ изменить таблицу данных и загрузить в нее данные в соответствии с рабочим столом и мобильным представлением.

PS: это предопределенная тема, поэтому я не смогу использовать bootstrap. Только HTML, JQuery и CSS могут использовать.

1 Ответ

0 голосов
/ 30 января 2020

Вам необходимо проверить ширину экрана при загрузке, а затем нарисовать экземпляр с данными в соответствии с нужной строкой на странице.

<script type="text/javascript">
    $(document).ready(function() {
        //initilise your datatable
        var myDtInstance=$('#datatable').DataTable( {
            "lengthMenu": [ 5,10, 20], //set required length menu
            "pageLength": 10 //set your default page length
        });
        windowSize = $(window).width(); //get your current window width
        //call function which will set the page length as per window size
        manipulateDataTableLen(5,10,myDtInstance);
        //this will called everytime window get resized
        $(window).resize(function(){
            manipulateDataTableLen(5,10,test);
        });
    });
    function manipulateDataTableLen(rowSize,defaultSize,dtInstance){
        windowSize = $(window).width();
        if(windowSize<=PUT_DESIRED_WINDOW_SIZE){
            dtInstance.page.len(rowSize).draw(false);
        }else{
            dtInstance.page.len(defaultSize).draw(false);
        }
    }
<script>
...