Custom sorting routine

Use your own comparator function to sort rows in grid in some special way.
The second column in the sample below is sorted by number of symbols in the text. But you have opportunity to set any custom criteria of sorting.

</> Source

<!DOCTYPE html>
<!--pro-->
<html>
<head>
	<title>Custom sorting routine</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
	<link rel="stylesheet" type="text/css" href="../../../codebase/fonts/font_roboto/roboto.css"/>
	<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
	<script src="../../../codebase/dhtmlx.js"></script>
	<script>
		var myGrid;
		function doOnLoad(){
			myGrid = new dhtmlXGridObject('gridbox');
			myGrid.setImagePath("../../../codebase/imgs/");
			myGrid.setHeader("Sales,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication");
			myGrid.setInitWidths("80,150,120,80,80,80,80,100");
			myGrid.setColAlign("right,left,left,right,center,left,center,center");
			myGrid.setColTypes("dyn,ed,ed,price,ch,co,ra,ro");
			var combobox = myGrid.getCombo(5);
			combobox.put("1","1 Hour");
			combobox.put("12","12 Hours");
			combobox.put("24","24 Hours");
			combobox.put("48","2 days");
			combobox.put("168","1 week");
			combobox.put("pick","pick up");
			combobox.put("na","na");
			myGrid.setColSorting("int,sort_custom,str,int,str,str,str,date");
			myGrid.setCustomSorting(sort_custom,2);
			myGrid.enableAutoWidth(true);
			myGrid.enableAutoHeight(true);
			myGrid.init();
			myGrid.load("../common/grid_16_rows_columns_manipulations.xml");
		}
		function sort_custom(a,b,order){
			var n=a.length;
			var m=b.length;
			if(order=="asc")
				return n>m?1:-1;
			else
				return n<m?1:-1;
		}
	</script>
</head>
<body onload="doOnLoad()">
	<h1>Custom sorting routine</h1>
	<p>
        Use your own comparator function to sort rows in grid in some special way.
        <br/>
        The second column in the sample below is sorted by number of symbols in the text.
		But you have opportunity to set any custom criteria of sorting.</p>
	<div id="gridbox" style="width:600px;height:450px;background-color:white;"></div>
</body>
</html>

Documentation

Check documentation to learn how to use the components and easily implement them in your applications.