Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
wiki:how_to_install [2010/04/13 02:06] preichow |
wiki:how_to_install [2017/12/09 14:37] (current) admin |
||
---|---|---|---|
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. |