Problem with scrollview rendering rows

[Wojak]

Hello,
I have again noticed a problem with the Scrollview in Datagrid. I have two datagrids with scrollview on the site. During the first load up, the rows do not render and after getData it shows any data, but not the “rows” are empty. Checking the item, I see that cells are generated, but they are empty. The POST method to the server renders the variable “rows”. After reload it shows correctly.

Code:

$(function () {
    $('#hor-premia-projektowa').datagrid({
        url: 'p/.../select-premia-projektowa.php',
        columns: [[
            { field: 'data_wprowadzenia', title: 'Data wprowadzenia', width: '120px', sortable: true, halign: 'center' },
            { field: 'wprowadzajacy', title: 'Wprowadzający', width: '100px', sortable: true, halign: 'center' },
            { field: 'realizacja_numer', title: 'Realizacja', width: '80px', sortable: true, align: 'center' },
            { field: 'nazwisko', title: 'Nazwisko', width: '100px', sortable: true, halign: 'center' },
            { field: 'imie', title: 'Imie', width: '100px', sortable: true, halign: 'center' },
            { field: 'kwota', title: 'Kwota', width: '90px', sortable: true, halign: 'center', align: 'right',
                formatter: function (value, row, index) {
                    if (value > 0) {
                        return new Intl.NumberFormat('pl-PL', { useGrouping: true, style: 'currency', currency: 'PLN' }).format(value);
                    } else {
                        return '';
                    }
                }
            },
            { field: 'opis', title: 'Opis', width: '430px', sortable: true, halign: 'center' },
            { field: 'zatwierdzona', title: 'Zatwierdzona', width: '80px', sortable: true, align: 'center',
                formatter: function (value, row, index) {
                    switch (value) {
                        case '1':
                            return '<i style="color:green;" class="fa fa-check fa-xl"></i>';
                        case '2':
                            return '<i style="color:red;" class="fa fa-times fa-xl"></i>';
                        default:
                            return '';
                    }
                }
            },
            { field: 'data_zatwierdzenia', title: 'Data zatwierdzenia', width: '120px', sortable: true, halign: 'center' },
            { field: 'zatwierdzajacy', title: 'Zatwierdzający', width: '100px', sortable: true, halign: 'center' },
            { field: 'data_wyplaty', title: 'Data naliczenia', width: '100px', sortable: true, align: 'center' },
            { field: 'wyplacona', title: 'Wypłacona', width: '80px', sortable: true, align: 'center',
                formatter: function (value, row, index) {
                    switch (value) {
                        case '1':
                            return '<i style="color:inherit;" class="fa fa-coins fa-xl"></i>';
                        default:
                            return '';
                    }
                }
            },
            { field: 'wyplacajacy', title: 'Wypłacający', width: '100px', sortable: true, halign: 'center' },
        ]],
        idField: 'id',
        singleSelect: true,
        rownumbers: true,
        // showFooter: true,
        pageSize: 100,
        remoteFilter: true,
        filterDelay: 1000,
        remoteSort: true,
        view: scrollview,
        onDblClickRow: function (index, row) {
            $(this).datagrid('selectRow', index);
            horPremiaProjektowaWinOpen(row.id);
        }
    }).datagrid('enableFilter');

    $('#hor-premia-projektowa-budzet').datagrid({
        url: 'p/.../select-premia-projektowa-budzet.php',
        columns: [[
            { field: 'realizacja_numer', title: 'Realizacja', width: '120px', sortable: true, halign: 'center' },
            { field: 'budzet', title: 'Budżet', width: '120px', sortable: true, halign: 'center', align: 'right',
                formatter: function (value, row, index) {
                    return new Intl.NumberFormat('pl-PL', { useGrouping: true, style: 'currency', currency: 'PLN' }).format(value);
                }
            },
            { field: 'wykorzystany_budzet', title: 'Wykorzystany budżet', width: '120px', sortable: true, halign: 'center', align: 'right',
                formatter: function (value, row, index) {
                    return new Intl.NumberFormat('pl-PL', { useGrouping: true, style: 'currency', currency: 'PLN' }).format(value);
                }
            },
            { field: 'roznica', title: 'Różnica', width: '120px', sortable: true, halign: 'center', align: 'right',
                formatter: function (value, row, index) {
                    return new Intl.NumberFormat('pl-PL', { useGrouping: true, style: 'currency', currency: 'PLN' }).format(value);
                }
            },
            { field: 'data_modyfikacji', title: 'Data modyfikacji', width: '160px', sortable: true, align: 'center' },
            { field: 'data_wprowadzenia', title: 'Data wprowadzenia', width: '160px', sortable: true, halign: 'center' },
        ]],
        idField: 'id_realizacja',
        singleSelect: true,
        rownumbers: true,
        pageSize: 100,
        remoteFilter: true,
        filterDelay: 1000,
        remoteSort: true,
        clientPaging: false,
        view: scrollview,
        onDblClickRow: function (index, row) {
            $(this).datagrid('selectRow', index);
            horPremiaProjektowaBudzetWinOpen(row.id_realizacja);
        }
    }).datagrid('enableFilter');
});

[jarry]

Please look at this example https://www.jeasyui.com/demo/test/test20.html. It works fine.