By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,442 Members | 1,316 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,442 IT Pros & Developers. It's quick & easy.

sorting in dojo grids

100+
P: 184
Hi all,
can anyone pl say how to sort the particular column in dojo grids by default...
For example..
If i'm having columns like...
col1,col2,col3,col4,col5 in the grid..
"col3" should be displayed in descending order by default..
please help me out...
Thanks in Advance...
Jun 12 '08 #1
Share this Question
Share on Google+
6 Replies


acoder
Expert Mod 15k+
P: 16,027
I would suggest you check the documentation. Something like this may help.
Jun 12 '08 #2

100+
P: 184
I would suggest you check the documentation. Something like this may help.

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

Expand|Select|Wrap|Line Numbers
  1.  
  2.  
  3. <%@ include file="JspBean.jsp" %>
  4. <%@ page import="java.util.*"%>
  5. <html>
  6. <head>
  7. <%
  8. response.setHeader("Cache-Control","no-cache"); //HTTP 1.1
  9. response.setHeader("Pragma","no-cache"); //HTTP 1.0
  10. response.setHeader("Expires", "-1"); //prevents caching at the proxy server
  11. response.setDateHeader("Expires", 0); //prevents caching at the proxy server
  12.  
  13. %>
  14. <link rel="stylesheet" type="text/css" href="../static/js/dojox/grid/_grid/Grid.css">
  15.  
  16. <script type="text/javascript" src="../static/js/dojo/dojo.js" djConfig="isDebug:false, parseOnLoad: true"></script>
  17. <script type="text/javascript">
  18.   dojo.require("dojox.grid.Grid");
  19.   dojo.require("dojox.data.QueryReadStore");
  20.   dojo.require("dojo.data.ItemFileReadStore");
  21.   dojo.require("dojo.parser");
  22.  
  23. function getData(inRowIndex)
  24.     {
  25.      if((inRowIndex % 2) == 0)
  26.      return "<a href=\"#\" style=\"color: blue\">IBM</a>";
  27.      else
  28.      return "<a href=\"#\" style=\"color: blue\">CISCO</a>";
  29.     }
  30.  
  31.     function getPr(inRowIndex)
  32.     {
  33.     if((inRowIndex % 3) == 0)
  34.      return "<img src=\"../static/images/pershingrule_indicator.gif\">"
  35.     }
  36.  
  37.  
  38. dojo.addOnLoad(function() {
  39. alert("addOnLoad");
  40.   (dijit.byId("grid")).setSortIndex(1,true);
  41.             });
  42.  
  43.  
  44. function sort()
  45. {
  46. alert("sort");
  47. grid.setSortIndex(1,true);
  48. }
  49.  
  50.     var col00 = {name:'Account #',colSpan:13,
  51.     headerStyles: 'background-image: none; background-color: #039;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'
  52.  
  53.     };
  54.  
  55.  
  56.  
  57.     var col0 = {name:'Account #',field:'account',width:5,
  58.     headerStyles: 'background-image: none; background-color: #039;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'
  59.  
  60.     };
  61.  
  62.     var col1 = {name:'Trade Ref#',field:'tradeRef',width:7,
  63.     headerStyles: 'background-image: none; background-color: #C6942B;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'
  64.     };
  65.  
  66.     var col2 = {name:'<a href="#" style="color: white">TD</a>',field:'td',width:3,
  67.     headerStyles: 'background-image: none; background-color: #039;FONT-WEIGHT:bold;'
  68.  
  69.     };
  70.     var col3 = {name:'<a href="#" style="color: white">SD</a>',field:'sd',width:5,
  71.     headerStyles: 'background-image: none; background-color: #006666;FONT-WEIGHT:bold;'
  72.     };
  73.     var col4 = {name:'<a href="#" style="color: white">IBD</a>',field:'ibd',width:5,
  74.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
  75.     };
  76.     var col5 = {name:'<a href="#" style="color: white">Exch</a>',field:'exch',width:5,
  77.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
  78.     };
  79.     var col6 = {name:'<a href="#" style="color: white">Side</a>',field:'side',width:5,
  80.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
  81.     };
  82.     var col7 = {name:'<a href="#" style="color: white">Symbol</a>',
  83.     field:'symbol',get:getData,width:5,
  84.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
  85.     };
  86.  
  87.     var col8 = {name:'<a href="#" style="color: white">PR</a>',field:'qty',get:getPr,width:5,
  88.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
  89.     };
  90.     var col9 = {name:'<a href="#" style="color: white">Price</a>',field:'price',width:5,
  91.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
  92.     };
  93.     var col10 = {name:'<a href="#" style="color: white">Money</a>',field:'money',width:5,
  94.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;',classes:"greenColumn"
  95.     };
  96.  
  97.     var col11 = {name:'<a href="#" style="color: white">SI/SO</a>',field:'siso',width:5,
  98.     headerStyles: 'background-image: none; background-color:#039;FONT-WEIGHT:bold;'
  99.     };
  100.  
  101.  
  102.     var col12 = {name:'FM',field:'fm',width:5,
  103.     headerStyles: 'background-image: none; background-color: #039;FONT-FAMILY: Arial, Verdana,  Helvetica, san-serif;FONT-SIZE: 12px;FONT-WEIGHT:bold;COLOR: #FFF;'
  104.     };                            
  105.  
  106.  
  107. var structure = [
  108. {
  109.         cells: [[
  110.                                 col0,
  111.                                 col1,
  112.                                 col2,
  113.                                 col3,
  114.                                 col4,
  115.                                 col5,
  116.                                 col6,
  117.                                 col7,
  118.                                 col8,
  119.                                 col9,
  120.                                 col10,
  121.                                 col11,
  122.                                 col12
  123.  
  124.                 ]                    
  125.                 ]
  126.             }
  127.     ];
  128.  
  129. </script>
  130. </head>
  131. <body >
  132.  
  133. <a href="#" onClick="sort(); return false;">sort</a>
  134.  
  135. <div dojoType="dojox.data.QueryReadStore" jsId="jananee", url="DojoGrid/jsp/testQueryDSController.jsp" requestMethod="post"></div>
  136.  
  137. <div dojoType="dojox.grid.data.DojoData" jsId="model" rowsPerPage="20" store="jananee" query="{ namespace: '*' }"></div>
  138.  
  139. <div id="grid" jsId="grid" dojoType="dojox.grid.Grid" model="model" structure="structure" delayScroll="true"></div>
  140.  
  141. </body>
  142. </html>
  143.  
  144.  
  145.  

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...
Jun 12 '08 #3

acoder
Expert Mod 15k+
P: 16,027
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?
Jun 12 '08 #4

100+
P: 184
Hi all,
How do i sort the numeric data in the column of dojo grids using table...
pl help... Thanks in Advance...
Jun 25 '08 #5

hsriat
Expert 100+
P: 1,654
You may find the available JS's table sorting components (free of cost) useful.
Just google for "sortable table javascript", or some similar keywords.
Jun 25 '08 #6

acoder
Expert Mod 15k+
P: 16,027
Merged threads since they seem to be relating to a similar problem.
Jun 25 '08 #7

Post your reply

Sign in to post your reply or Sign up for a free account.