sorting in dojo grids

**acoder** · Jun 12 '08, 08:45 AM

I would suggest you check the documentation. Something like this may help.

**gaya3** · Jun 12 '08, 12:14 PM

Originally posted by acoder

I would suggest you check the documentation. Something like this may help.

Thank u Acoder....
I have tried the following code....

Code:


<%@ include file="JspBean.jsp" %>
<%@ page import="java.util.*"%>
<html>
<head>
<%
response.setHeader("Cache-Control","no-cache"); //HTTP 1.1
response.setHeader("Pragma","no-cache"); //HTTP 1.0
response.setHeader("Expires", "-1"); //prevents caching at the proxy server
response.setDateHeader("Expires", 0); //prevents caching at the proxy server

%>
<link rel="stylesheet" type="text/css" href="../static/js/dojox/grid/_grid/Grid.css">

<script type="text/javascript" src="../static/js/dojo/dojo.js" djConfig="isDebug:false, parseOnLoad: true"></script>
<script type="text/javascript">
  dojo.require("dojox.grid.Grid");
  dojo.require("dojox.data.QueryReadStore");
  dojo.require("dojo.data.ItemFileReadStore");
  dojo.require("dojo.parser");
	
function getData(inRowIndex)
	{
	 if((inRowIndex % 2) == 0)
	 return "<a href=\"#\" style=\"color: blue\">IBM</a>";
	 else
	 return "<a href=\"#\" style=\"color: blue\">CISCO</a>";
	}
	
	function getPr(inRowIndex)
	{
	if((inRowIndex % 3) == 0)
	 return "<img src=\"../static/images/pershingrule_indicator.gif\">"
	}
	
  
dojo.addOnLoad(function() {
alert("addOnLoad");
  (dijit.byId("grid")).setSortIndex(1,true);
			});


function sort()
{
alert("sort");
grid.setSortIndex(1,true);
}
			
	var col00 = {name:'Account #',colSpan:13,
	headerStyles: 'background-image: none; background-color: #039;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'

	};



	var col0 = {name:'Account #',field:'account',width:5,
	headerStyles: 'background-image: none; background-color: #039;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'

	};

	var col1 = {name:'Trade Ref#',field:'tradeRef',width:7,
	headerStyles: 'background-image: none; background-color: #C6942B;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'
	};

	var col2 = {name:'<a href="#" style="color: white">TD</a>',field:'td',width:3,
	headerStyles: 'background-image: none; background-color: #039;FONT-WEIGHT:bold;'

	};
	var col3 = {name:'<a href="#" style="color: white">SD</a>',field:'sd',width:5,
	headerStyles: 'background-image: none; background-color: #006666;FONT-WEIGHT:bold;'
	};
	var col4 = {name:'<a href="#" style="color: white">IBD</a>',field:'ibd',width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
	};
	var col5 = {name:'<a href="#" style="color: white">Exch</a>',field:'exch',width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
	};
	var col6 = {name:'<a href="#" style="color: white">Side</a>',field:'side',width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
	};
	var col7 = {name:'<a href="#" style="color: white">Symbol</a>',
	field:'symbol',get:getData,width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
	};

	var col8 = {name:'<a href="#" style="color: white">PR</a>',field:'qty',get:getPr,width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
	};
	var col9 = {name:'<a href="#" style="color: white">Price</a>',field:'price',width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
	};
	var col10 = {name:'<a href="#" style="color: white">Money</a>',field:'money',width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;',classes:"greenColumn"
	};

	var col11 = {name:'<a href="#" style="color: white">SI/SO</a>',field:'siso',width:5,
	headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
	};


	var col12 = {name:'FM',field:'fm',width:5,
	headerStyles: 'background-image: none; background-color: #039;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'
	};							

  
var structure = [
{
		cells: [[
								col0,
								col1,
								col2,
								col3,
								col4,
								col5,
								col6,
								col7,
								col8,
								col9,
								col10,
								col11,
								col12

				]					
				]
			}
	];

</script>
</head>
<body >

<a href="#" onClick="sort(); return false;">sort</a>

<div dojoType="dojox.data.QueryReadStore" jsId="jananee", url="DojoGrid/jsp/testQueryDSController.jsp" requestMethod="post"></div>

<div dojoType="dojox.grid.data.DojoData" jsId="model" rowsPerPage="20" store="jananee" query="{ namespace: '*' }"></div>

<div id="grid" jsId="grid" dojoType="dojox.grid.Grid" model="model" structure="structure" delayScroll="true"></div>

</body>
</html>

By default, my first column is not getting sort... But when i click sort link its workin fine..... How can i overcome this... pl do help me...

**acoder** · Jun 12 '08, 12:49 PM

You don't seem to have added the clientSort attribute.

Also, is it not supposed be 0 for the sort index if you want to sort the first column?

**gaya3** · Jun 25 '08, 01:07 PM

Dojo grid sorting

Hi all,
How do i sort the numeric data in the column of dojo grids using table...
pl help... Thanks in Advance...

**hsriat** · Jun 25 '08, 01:24 PM

You may find the available JS's table sorting components (free of cost) useful.
Just google for "sortable table javascript", or some similar keywords.

**acoder** · Jun 25 '08, 02:11 PM

Merged threads since they seem to be relating to a similar problem.

sorting in dojo grids

sorting in dojo grids

Comment

Comment

Comment

Comment

Comment

Comment