jQWidgets Forums

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

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

Author

Grid doesn’t scroll in mobile devices any more after changing theme programmatically Posts

June 26, 2012 at 2:32 am Grid doesn’t scroll in mobile devices any more after changing theme programmatically #5322

vudh

Member

Hi,

Hereafter is my page that demonstrates dynamically changing themes, but the grid doesn’t scroll in mobile devices any more after changing theme successfully:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jqxGrid Demo</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <script src="base/jquery-1.7.1.min.js"></script>
    <link rel="stylesheet" href="styles/jqx.base.css" type="text/css" />
    <link rel="stylesheet" href="styles/jqx.classic.css" type="text/css" />
    <link rel="stylesheet" href="styles/jqx.darkblue.css" type="text/css" />
    <link rel="stylesheet" href="styles/jqx.energyblue.css" type="text/css" />
    <link rel="stylesheet" href="styles/jqx.shinyblack.css" type="text/css" />
    <script type="text/javascript" src="scripts/jqxcore.js"></script>
    <script type="text/javascript" src="scripts/jqxdata.js"></script>
    <script type="text/javascript" src="scripts/jqxbuttons.js"></script>
    <script type="text/javascript" src="scripts/jqxscrollbar.js"></script>
    <script type="text/javascript" src="scripts/jqxlistbox.js"></script>
    <script type="text/javascript" src="scripts/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="scripts/jqxgrid.js"></script>
    <script type="text/javascript" src="scripts/jqxgrid.sort.js"></script>
    <script type="text/javascript" src="scripts/jqxgrid.pager.js"></script>
    <script type="text/javascript" src="scripts/jqxgrid.grouping.js"></script>
    <script type="text/javascript" src="scripts/jqxgrid.selection.js"></script>
    <script type="text/javascript" src="generatedata.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var data = generatedata(500);

            var source =
            {
                localdata: data,
                datatype: "array"
            };

            var dataAdapter = new $.jqx.dataAdapter(source);
            $("#jqxgrid").jqxGrid({
                width: 670,
                theme: 'darkblue',
                source: dataAdapter,
                columnsresize: true,
                columns: [{ text: 'First Name', dataField: 'firstname', minwidth: 100, classname: 'header', cellclassname: 'textcell' },
            { text: 'Last Name', dataField: 'lastname', minwidth: 100, classname: 'header', cellclassname: 'textcell' },
            { text: 'Product', dataField: 'productname', minwidth: 100, classname: 'header', cellclassname: 'textcell' },
            { text: 'Quantity', dataField: 'quantity', width: 80, cellsalign: 'right', classname: 'header', cellclassname: 'numbercell' }
                ]
            });

            $("#themes").change(function () {
                $("#jqxgrid").jqxGrid({
                    theme: $(this).val()
                });
            });
        });
    </script>
    <style type="text/css">
        .header
        {
            font-weight: bold;
            font-size: 14px; /*margin-top:5px;*/
        }

        .textcell
        {
            /*color:Black;*/
        }

        .numbercell
        {
            color: Red;
        }
    </style>
</head>
<body class='default'>
    <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
        <div>
            Theme:
            <select id="themes">
                <option value="darkblue">Dark Blue</option>
                <option value="energyblue">Energy Blue</option>
                <option value="shinyblack">Shiny Black</option>
            </select>
        </div>
        <div id="jqxgrid">
        </div>
    </div>
</body>
</html>

Any ideas for me?

Thanks in advance,
vudh.

June 26, 2012 at 10:06 am Grid doesn’t scroll in mobile devices any more after changing theme programmatically #5340

Peter Stoev

Keymaster

Hi vudh,

There’s currently an issue in jqxGrid regarding the dynamically changing of themes which we will resolve in the next release. Thanks for the feedback!

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

June 26, 2012 at 10:08 am Grid doesn’t scroll in mobile devices any more after changing theme programmatically #5341

vudh

Member

Hi Peter,

I see that the grid doesn’t scroll in mobile devices when grouping also. Could you please check this case?

Thanks,
vudh

June 26, 2012 at 10:15 am Grid doesn’t scroll in mobile devices any more after changing theme programmatically #5342

Peter Stoev

Keymaster

Yes, it will not scroll on mobile via touch after a refresh of the content. You can still scroll however, using the Grid’s scrollbars. We are working on resolving the issue.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

August 28, 2013 at 6:43 am Grid doesn’t scroll in mobile devices any more after changing theme programmatically #27833

sircom

Member

Hello,

Is this issue already resolved?

Thanks!
Tony

Author

Posts

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

You must be logged in to reply to this topic.