Grid Filter or Sort

Suite and Optimus Suite 6
#1

Hi Guys,

I’m trying to filter and sort data.

Code already:

	var grid = new dhx.Grid("grid", {
		columns: [
			{ id: "customer", header: [{ text: "Customer", css: "title_grey" }, { content: "selectFilter" }], 
		],
		columnsAutoWidth: true,
		footerRowHeight: 35,
		headerRowHeight: 35,
		selection:true,
	});
	grid.data.load("getFlexAssetsData.php");

Data loads fine and is filterable.

As soon as I add a sort or filter line, it fails to load.

Example line:

	grid.data.filter({ by:"customer", match:"aa Example" });

I get the following error in console:

suite.js:6021 Uncaught TypeError: Cannot read property ‘map’ of undefined
at Object.toHtml (suite.js:6021)
at getCustomContentCell (suite.js:5820)
at suite.js:5855
at Array.map ()
at suite.js:5831
at Array.map ()
at getRows (suite.js:5831)
at Object.getFixedRows (suite.js:5899)
at Object.render (suite.js:20411)
at ViewModel.render (suite.js:19795)

I’ve also tried grid.data.load(“blah”).filter() but nothing works.

#2

Also sorry, is there an example of multiple column sort?
ie sort by customer column, then by blah column, then by blah2 column

I presume that’s what the “Custom sorting” section is, but it’s not explained what the format means.

#3

Please, note that the load() method loads data in async mode, so you need to use the load event to perform the filter or sorting after the data is loaded and rendered in the grid:

grid.data.events.on("load",function(){
grid.data.filter({ by:"customer", match:"aa Example" });
})
#4

In the docs:
https://docs.dhtmlx.com/suite/grid__usage.html#sortingdata
in the custom sorting article you are operating with the row (a and b). And you are able to get the data of any column using the a.column_id to use it for your sorting algorithm.

1 Like
#5

Thank you, very helpful!