jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Pagination and selection
This topic contains 1 reply, has 2 voices, and was last updated by ivailo 10 years ago.
Viewing 2 posts - 1 through 2 (of 2 total)
-
AuthorPagination and selection Posts
-
Hi, I have next question, my Grid has selectionmode = ‘checkbox’, when I’m click on “select all”, it selects all rows, then I’m unselect all rows by clicking “select all” again, go to the next page, and all rows are selected on this page why it’s happening.
Thanks.
Hi aser,
Update to the latest version 3.8.0
Try this code. It works fine.<!DOCTYPE html> <html lang="en"> <head> <title id='Description'>This example illustrates Rows Selection with a Checkbox. </title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.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/jqxgrid.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.pager.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.sort.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.filter.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxpanel.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="../../scripts/demos.js"></script> <script type="text/javascript"> $(document).ready(function () { var url = "../sampledata/orders.xml"; // prepare the data var source = { datatype: "xml", datafields: [ { name: 'ShippedDate', map: 'm\\:properties>d\\:ShippedDate', type: 'date' }, { name: 'Freight', map: 'm\\:properties>d\\:Freight', type: 'float' }, { name: 'ShipName', map: 'm\\:properties>d\\:ShipName', type: 'string' }, { name: 'ShipAddress', map: 'm\\:properties>d\\:ShipAddress', type: 'string' }, { name: 'ShipCity', map: 'm\\:properties>d\\:ShipCity', type: 'string' }, { name: 'ShipCountry', map: 'm\\:properties>d\\:ShipCountry', type: 'string' } ], root: "entry", record: "content", id: 'm\\:properties>d\\:OrderID', url: url }; var dataAdapter = new $.jqx.dataAdapter(source); // create jqxgrid. $("#jqxgrid").jqxGrid( { width: 850, height: 450, source: dataAdapter, pageable: true, autoheight: true, sortable: true, filterable: true, ready: function() { // called when the Grid is loaded. Call methods or set properties here. }, selectionmode: 'checkbox', altrows: true, columns: [ { text: 'Ship Name', datafield: 'ShipName', width: 250 }, { text: 'Shipped Date', datafield: 'ShippedDate', width: 100, cellsformat: 'yyyy-MM-dd' }, { text: 'Freight', datafield: 'Freight', width: 150, cellsformat: 'F2', cellsalign: 'right' }, { text: 'Ship City', datafield: 'ShipCity', width: 150 }, { text: 'Ship Country', datafield: 'ShipCountry'} ] }); }); </script> </head> <body class='default'> <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;"> <div id="jqxgrid"> </div> </div> </body> </html>
Best Regards,
Ivailo IvanovjQWidgets Team
http://www.jqwidgets.com -
AuthorPosts
Viewing 2 posts - 1 through 2 (of 2 total)
You must be logged in to reply to this topic.