jQuery UI Widgets › Forums › Grid › grid sorting problem
This topic contains 10 replies, has 2 voices, and was last updated by arkgroup 10 years, 4 months ago.
-
Authorgrid sorting problem Posts
-
I have grid with one column set as checkbox column type. I can check that checkbox.
However, after sorting different column, I cannot check that cell anymore.
If I remove sort, can check checkbox again.
Using v3.4.0.Thanks
Hi arkgroup,
Please, prepare and share a sample which demonstrates the reported behavior so we can test your scenario. We have working demo with enabled Sorting and Checkbox column and in our demo the functionality works correctly with ver. 3.4.0 – http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/defaultfunctionality.htm?arctic
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comI can replicate that behavior by modifying your demo. It’s because of filter. Please add reference to jqxgrid.filter.js and add this code to $(“#jqxgrid”).jqxGrid
ready: function () {
var filtergroup = new $.jqx.filter();
var filter_or_operator = 1;
var filtervalue = ’10’;
var filtercondition = ‘equal’;
var filter1 = filtergroup.createfilter(‘stringfilter’, filtervalue, filtercondition);
filtergroup.addfilter(filter_or_operator, filter1);
$(“#jqxgrid”).jqxGrid(‘addfilter’, ‘QuantityPerUnit’, filtergroup);
// apply the filters.
$(“#jqxgrid”).jqxGrid(‘applyfilters’);},
Hi arkgroup,
We cannot reproduce this. See: http://screencast.com/t/fcx0zHAqi32
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comI can reproduce by running this code from your demo. After column sort, I cannot check checkbox.
<!DOCTYPE html>
<html lang=”en”>
<head>
<title id=’Description’>This demo illustrates the basic functionality of the Grid plugin. The jQWidgets Grid plugin offers rich support for interacting with data, including paging, grouping and sorting.
</title>
<link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”../../scripts/jquery-1.10.2.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/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.sort.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/jqxgrid.edit.js”></script>
<script type=”text/javascript” src=”../../scripts/demos.js”></script>
<script src=”../../jqwidgets/jqxgrid.filter.js” type=”text/javascript”></script>
<script type=”text/javascript”>
$(document).ready(function () {
var url = “../sampledata/products.xml”;// prepare the data
var source =
{
datatype: “xml”,
datafields: [
{ name: ‘ProductName’, type: ‘string’ },
{ name: ‘QuantityPerUnit’, type: ‘int’ },
{ name: ‘UnitPrice’, type: ‘float’ },
{ name: ‘UnitsInStock’, type: ‘float’ },
{ name: ‘Discontinued’, type: ‘bool’ }
],
root: “Products”,
record: “Product”,
id: ‘ProductID’,
url: url
};var cellsrenderer = function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
if (value < 20) {
return ‘<span style=”margin: 4px; float: ‘ + columnproperties.cellsalign + ‘; color: #ff0000;”>’ + value + ‘</span>’;
}
else {
return ‘<span style=”margin: 4px; float: ‘ + columnproperties.cellsalign + ‘; color: #008000;”>’ + value + ‘</span>’;
}
}var dataAdapter = new $.jqx.dataAdapter(source, {
downloadComplete: function (data, status, xhr) { },
loadComplete: function (data) { },
loadError: function (xhr, status, error) { }
});// initialize jqxGrid
$(“#jqxgrid”).jqxGrid(
{
width: 850,
source: dataAdapter,
pageable: true,
autoheight: true,
sortable: true,
altrows: true,
enabletooltips: true,
editable: true,
selectionmode: ‘multiplecellsadvanced’,
columns: [
{ text: ‘Product Name’, columngroup: ‘ProductDetails’, datafield: ‘ProductName’, width: 250 },
{ text: ‘Quantity per Unit’, columngroup: ‘ProductDetails’, datafield: ‘QuantityPerUnit’, cellsalign: ‘right’, align: ‘right’, width: 200 },
{ text: ‘Unit Price’, columngroup: ‘ProductDetails’, datafield: ‘UnitPrice’, align: ‘right’, cellsalign: ‘right’, cellsformat: ‘c2’, width: 200 },
{ text: ‘Units In Stock’, datafield: ‘UnitsInStock’, cellsalign: ‘right’, cellsrenderer: cellsrenderer, width: 100 },
{ text: ‘Discontinued’, columntype: ‘checkbox’, datafield: ‘Discontinued’ }
],
ready: function () {
var filtergroup = new $.jqx.filter();
var filter_or_operator = 1;
var filtervalue = ’10’;
var filtercondition = ‘equal’;
var filter1 = filtergroup.createfilter(‘stringfilter’, filtervalue, filtercondition);
filtergroup.addfilter(filter_or_operator, filter1);
$(“#jqxgrid”).jqxGrid(‘addfilter’, ‘QuantityPerUnit’, filtergroup);
// apply the filters.
$(“#jqxgrid”).jqxGrid(‘applyfilters’);},
columngroups: [
{ text: ‘Product Details’, align: ‘center’, name: ‘ProductDetails’ }
]
});
});
</script>
</head>
<body class=’default’>
<div id=’jqxWidget’ style=”font-size: 13px; font-family: Verdana; float: left;”>
<div id=”jqxgrid”>
</div>
</div>
</body>
</html>Hi arkgroup,
Well, unfortunately, we are unable to using jQWidgets 3.4.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comCan you post your code to JSFiddle?
Thanks
Hi arkgroup,
The defaultfunctionality demo with enabled filtering. You can see its code from the demo section. Add jqxgrid.filter.js and add filterable: true. Sorry, but I cannot add anything additional to this topic.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comThat is it, adding filterable: true fix the problem. My code from previous post did not have that.
Thanks for your help.
Hi arkgroup,
Ok, but why did you try then to add a filter to a Grid which is with disabled filtering?
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comI miss filter setting and filter still works.
-
AuthorPosts
You must be logged in to reply to this topic.