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:how_to_install [2010/04/12 03:48]
preichow
wiki:how_to_install [2017/12/09 14:37] (current)
admin
Line 6: Line 6:
 Once you've downloaded the [[:​wiki:​download |needed packages]], you can continue with the installation. ​ Once you've downloaded the [[:​wiki:​download |needed packages]], you can continue with the installation. ​
  
-If you are casual ​user of jqGrid, you should complete the Basic Installation below.+If you'​re ​normal ​user of jqGrid, you should complete the Basic Installation below, which installs all the files needed to use jqGrid.
  
-If you are a developer and want access to the source code to find bugs and make improvements,​ complete the Basic Installation first, and then perform the additional steps in the Development Installation section below.+If you want access to the jqGrid ​source code to find bugs and make improvements,​ complete the Basic Installation first, and then perform the additional steps in the Development Installation section below.
  
  
Line 40: Line 40:
           * ....           * ....
       * Changes.txt       * Changes.txt
-      * jquery-1.3.2.min.js+      * jquery-1.4.2.min.js
       * jquery.jqGrid.min.js       * jquery.jqGrid.min.js
  
Line 50: Line 50:
 <​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 55: Line 56:
 <link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​css/​ui.jqgrid.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>​+<script src="​js/​jquery-1.4.2.min.js"​ type="​text/​javascript"></​script>​
 <script src="​js/​i18n/​grid.locale-en.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 src="​js/​jquery.jqGrid.min.js"​ type="​text/​javascript"></​script>​
Line 90: Line 91:
 <​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 103: Line 105:
 </​style>​ </​style>​
  
-<script src="​js/​jquery-1.3.2.min.js"​ type="​text/​javascript"></​script>​+<script src="​js/​jquery-1.4.2.min.js"​ type="​text/​javascript"></​script>​
 <script src="​js/​i18n/​grid.locale-en.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 src="​js/​jquery.jqGrid.min.js"​ type="​text/​javascript"></​script>​
Line 123: Line 125:
  
 ===== Development Installation ===== ===== Development Installation =====
 +If you choose the development installation,​ your version of jqGrid will be using uncompressed source code rather than minimized production code, for easier reading.  ​
  
-With the development installation, your version of jqGrid ​will be using uncompressed ​source code files rather than the minimized production files.+<note important>​There are two types of development installation ​as of version ​4.0</​note>​  
 + 
 +**Development installation after 4.x versions** \\ 
 +This type of installation is easy. It require ​ only to change the file name from //jquery.jqGrid.min.js// to j//​query.jqGrid.src.js//​. Actually the jquery.jqGrid.src.js is one file which contain all the files in one not compressed file. 
 +The location of the file is in the js folder where the compressed jquery.jqGrid.min.js is. 
 +This type of installation can look like this: 
 + 
 + 
 +<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"​ /> 
 + 
 +<​style>​ 
 +html, body { 
 +    margin: 0; 
 +    padding: 0; 
 +    font-size: 75%; 
 +
 +</​style>​ 
 + 
 +<script src="​js/​jquery-1.4.2.min.js"​ type="​text/​javascript"></​script>​ 
 +<script src="​js/​i18n/​grid.locale-en.js"​ type="​text/​javascript"></​script>​ 
 +<script src="​js/​jquery.jqGrid.src.js"​ type="​text/​javascript"></​script>​ 
 + 
 +</​head>​ 
 +<​body>​ 
 + 
 + 
 + 
 +</​body>​ 
 +</​html>​ 
 +</​code>​ 
 + 
 + 
 + 
 +**Development installation prior to version 4.0.0 and in case if you download the code from GitHub** 
 + 
 +Also, the source code is split into a number of different ​files, one for each jqGrid module. ​ This also makes it easier to find a particular piece of code.
  
 Once you've copied the files and folders as described in the basic installation above, you should copy the jqGrid source files to complete the development installation. Once you've copied the files and folders as described in the basic installation above, you should copy the jqGrid source files to complete the development installation.
Line 144: Line 190:
           */css/           */css/
               * ui-jqgrid.css               * ui-jqgrid.css
-              * jquery.searchFilter.css 
           * grid.base.js           * grid.base.js
           * grid.celledit.js           * grid.celledit.js
           * grid.common.js           * grid.common.js
           * grid.custom.js           * grid.custom.js
 +          * grid.filter.js
           * grid.formedit.js           * grid.formedit.js
           * grid.import.js           * grid.import.js
           * grid.inlinedit.js           * grid.inlinedit.js
           * grid.loader.js           * grid.loader.js
-          * grid.postext.js +          * grid.jqueryui.js
-          * grid.setcolumns.js+
           * grid.subgrid.js           * grid.subgrid.js
           * grid.tbltogrid.js           * grid.tbltogrid.js
Line 161: Line 206:
           * jqModal.js           * jqModal.js
           * jquery.fmatter.js           * jquery.fmatter.js
-          * jquery.searchFilter.js 
-          * json2.js 
           * JsonXml.js           * JsonXml.js
-      * jquery-1.3.2.min.js+      * jquery-1.4.2.min.js
  
  
Line 186: Line 229:
         { include: true, incfile:'​grid.treegrid.js'​},​ //jqGrid treegrid         { include: true, incfile:'​grid.treegrid.js'​},​ //jqGrid treegrid
         { include: true, incfile:'​grid.custom.js'​},​ //jqGrid custom ​         { include: true, incfile:'​grid.custom.js'​},​ //jqGrid custom ​
-        { include: true, incfile:'​grid.postext.js'​},​ //jqGrid postext 
         { include: true, incfile:'​grid.tbltogrid.js'​},​ //jqGrid table to grid          { include: true, incfile:'​grid.tbltogrid.js'​},​ //jqGrid table to grid 
-        { include: true, incfile:'​grid.setcolumns.js'​},​ //jqGrid setcolumns 
         { include: true, incfile:'​grid.import.js'​},​ //jqGrid import         { include: true, incfile:'​grid.import.js'​},​ //jqGrid import
         { include: true, incfile:'​jquery.fmatter.js'​},​ //jqGrid formater         { include: true, incfile:'​jquery.fmatter.js'​},​ //jqGrid formater
         { include: true, incfile:'​JsonXml.js'​},​ //xmljson utils         { include: true, incfile:'​JsonXml.js'​},​ //xmljson utils
-        { include: true, incfile:'​jquery.searchFilter.js'} // search Plugin+        { include: true, incfile:'​grid.filter.js'} // search Plugin
     ];     ];
     var filename;     var filename;
Line 232: Line 273:
 <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-lightness/​jquery-ui-1.7.1.custom.css"​ />
 <link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​js/​src/​css/​ui.jqgrid.css"​ /> <link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​js/​src/​css/​ui.jqgrid.css"​ />
-<link rel="​stylesheet"​ type="​text/​css"​ media="​screen"​ href="​js/​src/​css/​jquery.searchFilter.css"​ /> 
  
 <​style>​ <​style>​
Line 242: Line 282:
 </​style>​ </​style>​
  
-<script src="​js/​jquery-1.3.2.min.js"​ type="​text/​javascript"></​script>​+<script src="​js/​jquery-1.4.2.min.js"​ type="​text/​javascript"></​script>​
 <script src="​js/​src/​grid.loader.js"​ type="​text/​javascript"></​script>​ <script src="​js/​src/​grid.loader.js"​ type="​text/​javascript"></​script>​
  
Line 252: Line 292:
 </​code>​ </​code>​
  
-That'​s ​all! You are ready to debug and improve jqGrid. ​ Click [[:​wiki:​how_it_works|here]] to learn how jqGrid works.+That is all! You are ready to debug and improve jqGrid. Click [[:​wiki:​how_it_works|here]] to learn how jqGrid works.
  
  

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