jQWidgets Forums

jQuery UI Widgets Forums Grid pagenum and pagesize grid parameter isn't working

This topic contains 8 replies, has 2 voices, and was last updated by  Martin 4 years, 3 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author

  • robin
    Participant

    I am using the example “Server Side Paging with jqxGrid using PHP and MySQL” and the pagenum and pagesize parameters aren’t returning anything and it is producing the following error, “Undefined array key ‘pagenum'”. I thought those parameters were sent by default so I am not sure what I am doing wrong?

    My code is the following:

    <?php
    require 'vendor/autoload.php';
    
    use PostgreSQLTutorial\Connection as Connection;
    use PostgreSQLTutorial\CustomerDB as CustomerDB;
    
    try {
        $pdo = Connection::get()->connect();
        $pagenum = $_GET['pagenum'];
        $pagesize = $_GET['pagesize'];
        $start = $pagenum * $pagesize;
        $customerDB = new CustomerDB($pdo);
        $customers = $customerDB->findCustomer(5, 1);
    } catch (\PDOException $e) {
        echo $e->getMessage();
    }
    ?>
    <!DOCTYPE html>
    <html>
        <head>
            <title>PostgreSQL PHP Querying Data Demo</title>            
            <link rel="stylesheet" href="../jqwidgets/styles/jqx.base.css" type="text/css" />
            <link rel="stylesheet" href="../jqwidgets/styles/jqx.classic.css" type="text/css" />
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <script type="text/javascript" src="../jquery-1.11.1.min.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxcore.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxbuttons.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxscrollbar.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxmenu.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxcheckbox.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxlistbox.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxdropdownlist.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxgrid.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxgrid.pager.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxgrid.selection.js"></script>
            <script type="text/javascript" src="../jqwidgets/jqxdata.js"></script>
    
            <script type="text/javascript">
                $(document).ready(function () {
                    // prepare the data
                    var theme = 'classic';
                    var dataCust = <?php echo json_encode($customers); ?>;
                    var source =
                    {
                        datatype: "json",
                        datafields: [
                            { name: 'CompanyName' },
                            { name: 'ContactName' },
                            { name: 'ContactTitle' },
                            { name: 'City' },
                            { name: 'Country' }
                        ],
                        cache: false,
                        localdata: dataCust,
                        root: 'Rows',
                        beforeprocessing: function (data) {
                            source.totalrecords = data[0].TotalRows;
                        }
                    };
                    var dataadapter = new $.jqx.dataAdapter(source);
                    var paginginfo = $("#jqxgrid").jqxGrid('getpaginginformation');
                    console.log('Page info is: ' + paginginfo)
                    // initialize jqxGrid
                    $("#jqxgrid").jqxGrid(
                    {
                        width: 600,
                        source: dataadapter,
                        pageable: true,
                        theme: theme,
                        autoheight: true,
                        pagesize: 10,
                        pagesizeoptions: ['50', '100', '250'],
                        virtualmode: true,
                        rendergridrows: function () {
                            return dataadapter.records;
                        },
                        columns:
                        [
                            { text: 'Company Name', datafield: 'CompanyName', width: 250 },
                            { text: 'Contact Name', datafield: 'ContactName', width: 200 },
                            { text: 'Contact Title', datafield: 'ContactTitle', width: 200 },
                            { text: 'City', datafield: 'City', width: 100 },
                            { text: 'Country', datafield: 'Country', width: 140 }
                        ]
                    });
                });
            </script>
        </head>
        <body class='default'>
            <div id="jqxgrid"></div>
        </body>    
    </html>

    robin
    Participant

    Anyone have any suggestions? It says on the documentation that, “By default, the Grid sends the following data to the server: ” but I don’t see those parameters at all.


    Martin
    Participant

    Hello robin,

    Please, check this Demo about PHP Server Paging. You can see in the Network tab of the developer tools that the following query parameters are sent:

    filterscount: 0
    groupscount: 0
    pagenum: 1
    pagesize: 10
    recordstartindex: 10
    recordendindex: 20

    Best regards,
    Martin Yotov

    jQWidgets Team
    https://www.jqwidgets.com/


    robin
    Participant

    Hi, I used the document provided and I still don’t get the pagenum and pagesize. Everything else is working great but for some reason the grid isn’t sending those values to the server. I am using Apache and instead of index.htm as provided in the reference, I instead used index.php.


    Martin
    Participant

    Hello robin,

    Could you send us an example where we could inspect and debug this behavior?

    Best regards,
    Martin Yotov

    jQWidgets Team
    https://www.jqwidgets.com/


    robin
    Participant

    Hi yes,

    Here is the link that you can inspect the behavior: https://cosmos.physast.uga.edu/pdo_test/postgresqlphpconnect/index.php


    Martin
    Participant

    Hello robin,

    In the example that you have provided, you are using localdata in the source, instead of url so no request is sent to the server at all.
    You can see in this Demo that when the page is changed a request is sent with the following query parameters:

    filterscount: 0
    groupscount: 0
    pagenum: 1
    pagesize: 10
    recordstartindex: 10
    recordendindex: 20

    Best regards,
    Martin Yotov

    jQWidgets Team
    https://www.jqwidgets.com/


    robin
    Participant

    Yes, but I prefer to use localdata instead of url. Is there a way to do that?


    Martin
    Participant

    Hello robin,

    There is no way to do this. You need to use the url of the server so the parameters are sent to it.

    Best regards,
    Martin Yotov

    jQWidgets Team
    https://www.jqwidgets.com/

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.