Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
wiki:howto_grid_base [2009/11/09 09:02]
tony
wiki:howto_grid_base [2017/12/12 17:12] (current)
admin
Line 3: Line 3:
 ==== Allow FireFox to work with RTL (Right To Left) languages ==== ==== Allow FireFox to work with RTL (Right To Left) languages ====
  
-jqGrid ​support ​fully FireFox versions 3.x  and Internet Explorer versions >=6.+jqGrid fully supports RTL in FireFox versions 3.x  and Internet Explorer versions >​=6 ​
 The default settings in FireFox are not compatible with RTL. In order to change this: The default settings in FireFox are not compatible with RTL. In order to change this:
   - In the url bar in FireFox type about:​config and confirm the alert dialog.   - In the url bar in FireFox type about:​config and confirm the alert dialog.
Line 17: Line 17:
 <​head>​ <​head>​
 <meta http-equiv="​Content-Type"​ content="​text/​html;​ charset=utf-8"​ /> <meta http-equiv="​Content-Type"​ content="​text/​html;​ charset=utf-8"​ />
 +<meta http-equiv="​X-UA-Compatible"​ content="​IE=edge"​ />
 <​title>​My First Grid</​title>​ <​title>​My First Grid</​title>​
   ​   ​
Line 43: Line 44:
 This line should be after the language file and before the jqGrid JS file This line should be after the language file and before the jqGrid JS file
 <​note>​New jqGrid API is available from version 3.6 and up</​note>​ <​note>​New jqGrid API is available from version 3.6 and up</​note>​
-==== Configuring jqGrid to use build JSON.parse for browsers that support it==== 
-At the time of this writing, three major browsers already include support for native JSON parsing: IE8, Firefox 3.5, and Chrome 3. \\ 
-This should be done in the installation procedure following these steps: 
-<code html> 
-<​!DOCTYPE html PUBLIC "​-//​W3C//​DTD XHTML 1.0 Strict//​EN"​ "​http://​www.w3.org/​TR/​xhtml1/​DTD/​xhtml1-strict.dtd">​ 
-<html xmlns="​http://​www.w3.org/​1999/​xhtml"​ xml:​lang="​en"​ lang="​en">​ 
-<​head>​ 
-<meta http-equiv="​Content-Type"​ content="​text/​html;​ charset=utf-8"​ /> 
-<​title>​My First Grid</​title>​ 
-  ​ 
-<link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​css/​ui-lightness/​jquery-ui-1.7.1.custom.css"​ /> 
-<link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​css/​ui.jqgrid.css"​ /> 
  
-<script src="​js/​jquery-1.3.2.min.js"​ type="​text/​javascript"></​script>​ +==== Client side sorting, but server side paging ​====
-<script src="​js/​i18n/​grid.locale-en.js"​ type="​text/​javascript"></​script>​ +
-<script type="​text/​javascript">​ +
- jQuery.jgrid.useJSON ​true; +
-</​script>​ +
-<script src="​js/​jquery.jqGrid.min.js"​ type="​text/​javascript"></​script>​+
  
-</​head>​ +In order to have this we should define two events in the grid - loadComplete and onPagingBelow is the code how can be this achieved
-<​body>​ +
-... +
-</​body>​ +
-</​html>​ +
-</code+
-Note the callling of+
 <code javascript>​ <code javascript>​
-<script type="​text/​javascript">​ +jQuery("#gridid").jqGrid({
- jQuery.jgrid.useJSON = true; +
-</​script>​ +
-</​code>​ +
-This line should be after the language file and before the jqGrid JS file. \\ Note that this does not affect browsers that do not support this function - i.e if the broser does not support it we use eval to parse the request. +
-<​note>​This option is available from version 3.6 and up</​note>​ +
- +
-==== Replace the jqGrid eval with JSON.parse when we use JSON response ==== +
-In case if you want to use the JSON.parse provided from [[http://​www.json.org/​js.html ​ | here ]] you can do the following  +
-<code html> +
-<​!DOCTYPE html PUBLIC ​"-//W3C//DTD XHTML 1.0 Strict//EN" ​"​http://​www.w3.org/​TR/​xhtml1/​DTD/​xhtml1-strict.dtd">​ +
-<html xmlns="​http://​www.w3.org/​1999/​xhtml"​ xml:​lang="​en"​ lang="​en">​ +
-<​head>​ +
-<meta http-equiv="​Content-Type"​ content="​text/​html;​ charset=utf-8"​ /> +
-<​title>​My First Grid</​title>​ +
-   +
-<link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​css/​ui-lightness/​jquery-ui-1.7.1.custom.css"​ /> +
-<link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​css/​ui.jqgrid.css"​ /> +
- +
-<script src="​js/​json2"​ type="​text/​javascript"></​script>​ +
-<script src="​js/​jquery-1.3.2.min.js"​ type="​text/​javascript"></​script>​ +
-<script src="​js/​i18n/​grid.locale-en.js"​ type="​text/​javascript"></​script>​ +
-<script src="​js/​jquery.jqGrid.min.js"​ type="​text/​javascript"></​script>​ +
-<script type="​text/​javascript">​ +
-   ​jQuery.extend(jQuery.jgrid,​{ +
-      parse:​function(jsstring) { +
-         ​return JSON.parse(jsstring);​ +
-      } +
-   }); +
-</​script>​ +
- +
-</​head>​ +
-<​body>​+
 ... ...
-</body> +datatype: '​json', ​// can be xml 
-</html>+loadComplete : function () { 
 +   ​jQuery("#​gridid"​).jqGrid('​setGridParam',​{datatype:'​local'​});​ 
 +}, 
 +onPaging : function(which_button) { 
 +   ​jQuery("#​gridid"​).jqGrid('​setGridParam',​{datatype:'​json'​});​ 
 +}, 
 +... 
 +});
 </​code>​ </​code>​
 +In order local sorting to work properly a sorttype parameter in colModel should be set

QR Code
QR Code wiki:howto_grid_base (generated for current page)