jqGrid Wiki wiki

wiki:adjacency_model

2017-12-12T19:21:45+03:00

Adjacency Model As discussed in previous chapter Configuration one of the important part is the treeReader property. Configuring this properly and understanding the basic concept of the nested set model will make your life easy. treeReader Configuration The default treeReader Configuration when we use tree grid with adjacency model is:

wiki:advanced_searching

2017-12-12T19:17:32+03:00

Advanced Searching Advanced searching is a way to search on multiple fields at the same time with different conditions. Advanced searching and single searching use the same method, but with different settings and posting data. Installation In order to use this method the following modules should be included when downloading the grid: Common, Form Edit, filter Plugin. For more information refer to

wiki:begin

2017-12-12T19:06:35+03:00

Before you begin Before you begin with the jqGrid plugin you need to have a basic knowledge of JavaScript. Also you will need to have a basic knowledge of jQuery. For more information about jQuery and basic lessons visit jQuery site Having this knowledge you are ready to begin to play with jqGrid starting from here

wiki:cell_editing

2017-12-12T19:18:45+03:00

Cell Editing Cell editing provides the frontend user with functionality to change the contents of one single cell from a row and then the developer has the abbility to handle the changed data by AJAX or in a jqGrid cell edit event (see below). Cell Editing supports key navigation and editing individual cells, with the following behaviour:

wiki:change

2014-02-18T16:57:13+03:00

Change Log New Log file can be found here jqGrid 4.5.4 changes and fixes Additions and Changes * dataUrl now can be a function * Adding beforeAddRow, beforeEditRow,beforeSaveRow, beforeCancelRo events in inline navigator. They are called before the action. If function return false the action is not performed.

wiki:changetwo

2016-01-18T13:41:31+03:00

Change Log Old Log data can be found here jqGrid 5.0.2 changes and fixes Additions and Changes * Support for jQuery versions 1.12.0 and 2.2.0 * Add support for nullifempty in celledit. * Adding name parameter (cell which is changed) to the serializeCellData in editCell method.

wiki:colmodel_options

2018-02-02T22:54:41+03:00

ColModel API The colModel property defines the individual grid columns as an array of properties. This is the most important part of the jqGrid. Syntax: jQuery("#gridid").jqGrid({ ... colModel: [ {name:'name1', index:'index1'...}, {...}, ... ], ... });

wiki:common_rules

2017-12-12T19:18:04+03:00

Common Editing Properties One of the key reasons for displaying data in a grid is to edit it, quickly and easily. jqGrid supports editing data in three ways: * cell editing: edit specific cells in a gird * inline editing: edit several cells in the same row * form editing: create a form to edit outside of the grid

wiki:conventions

2017-12-12T19:10:42+03:00

Conventions An instance of jqGrid is a javascript object, with properties, events and methods. Properties may be strings, numbers, arrays, boolean values or even other objects. Calling Convention: Java Script code jQuery("#grid_id").jqGrid(options);

wiki:custom_buttons

2010-05-04T14:51:42+03:00

Custom Buttons Custom Buttons are a way to define your own button and action in the pager. Definition Calling Convention: or using the new

wiki:custom_formatter

2017-12-12T19:13:43+03:00

Custom Formatter You can define your own formatter for a particular column. Usually this is a function. When set in the formatter option this should not be enclosed in quotes and not entered with () - show just the name of the function.For example,

wiki:custom_searching

2017-12-12T19:16:01+03:00

Custom Searching This method can be called to construct an custom search form for the grid. The method uses the url option in grid to perform a search to the server. When the search is activated, an array of type name:value is posted to the server. Note that this array is added to the postData parameter. We post only fields that have an entered value. When we clear the the search form, the values are deleted from the postData array. When posting to the server, we try to pass, not the name, b…

wiki:dokuwiki

2009-11-28T10:07:38+03:00

DokuWiki wiki:dokuwiki DokuWiki is a standards compliant, simple to use Wiki, mainly aimed at creating documentation of any kind. It is targeted at developer teams, workgroups and small companies. It has a simple but powerful syntax which makes sure the datafiles remain readable outside the Wiki and eases the creation of structured texts. All data is stored in plain text files

wiki:download

2017-12-12T19:07:16+03:00

Downloading jqGrid Once you have a basic understanding of what Java Script and jQuery are and what they do, you're ready to try jqGrid! 1) Run the Download Builder on the jqGrid website to download a copy of jqGrid. jqGrid's download builder allows you to choose the components you would like to download and get a custom version of the plugin for your project.

wiki:events

2018-02-02T22:54:17+03:00

Events The action to take on an event is set as a property of the grid, e.g. See also jqGrid Methods var lastSel; jQuery("#gridid").jqGrid({ ... onSelectRow: function(id){ if(id && id!==lastSel){ jQuery('#gridid').restoreRow(lastSel); lastSel=id; } jQuery('#gridid').editRow(id, true); }, ... });

wiki:faq

2018-11-10T05:44:11+03:00

Where can I see live examples of jqGrid? Can I use jqGrid with an ASP MVC?

wiki:features

2009-11-28T10:07:39+03:00

Features jqGrid is a very good grid control. Here are some of its features; Basic Grid jqGrid has consistently been developed with ease of use in mind. The user should feel at ease from installation to administration. * CSS based themes. jqGrid is compatible with UI Theming. Developers can change the grid skin by defining their own using the UI

wiki:first_grid

2017-12-12T19:10:17+03:00

My First Grid For this tutorial, and as an example to refer to throughout this documentation, we’re going to create a grid with invoice information. You need the following three things in order to use jqGrid : * A database with some sample data,

wiki:form_editing

2017-12-12T19:19:54+03:00

Form Editing jqGrid supports creating a form “on the fly” to view, add, edit, delete, or search grid data. A screenshot of an “Add Record” form is shown below: The methods listed in the table below are included in the navGrid (navigator method).

wiki:frozencolumns

2017-12-09T16:51:04+03:00

It is quit easy for developers to make some columns frozen/locked within jqGrid. The locked columns do not scroll out of view when users moving horizontally across the grid. This is quite useful when you dealing with wide table with some fields should be visible permanently.

wiki:grouping

2017-12-09T16:51:29+03:00

Common rules Grouping is a way to group data by diffrent criteria. jqGrid currently supports one level of grouping. The simple way to group in jqGrid is to enable grouping with the grid option grouping:true and define a field name on which grouping occurs. The name should correspond to the name in colModel. The definition is done with array

wiki:groupingheadar

2017-12-09T16:52:20+03:00

Common rules Header grouping is a way to add additional columns above the header grid rows, so that they are grouped in a way you need them. Typical implementation can look like the picture below: We support two types of grouping - with colSpan enabled and colSpan disabled.

wiki:how_it_works

2017-12-12T19:08:16+03:00

How it Works Understanding how jqGrid works will help you get up to speed with the full capabilities of the plugin. The first thing to understand is that there are two aspects to working with tabular data : * Client-side representation, and * Server-side manipulation

wiki:how_to_install

2017-12-09T16:37:11+03:00

How to Install Installation of jqGrid is just a matter of copying the files and folders to your web server or development directory. Once you've downloaded the needed packages, you can continue with the installation. If you're a normal user of jqGrid, you should complete the Basic Installation below, which installs all the files needed to use jqGrid.

wiki:howto_grid_base

2017-12-12T19:12:41+03:00

HOW TO jqGrid common solutions Allow FireFox to work with RTL (Right To Left) languages 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:

wiki:howto_navigator

2017-12-09T16:43:37+03:00

There is no display of static data in a modal form of editing of a line. I.e. it is necessary some data Da Lat only on reading

wiki:import_methods

2017-12-12T19:25:56+03:00

Importing and exporting There are times when it is useful to be able to import or export the entire grid configuration to another file format: * Grids constructed on the server can be reconstructed after sorting or paging, so a different configuration can be quickly used as required

wiki:inline_editing

2017-12-12T19:19:22+03:00

Inline Editing Inline editing is a quick way to update database information by making changes directly in the row of the grid, as seen in the image below: To use Inline Editing, users select a row with the mouse. In response, jqGrid converts each editable field to a data entry cell, as seen in the Name and Price fields above. Cells that aren't editable, such as the ID field above, don't change appearance and remain read-only. Whether an individual column is editable or read-only is contro…

wiki:jqgriddocs

2018-01-15T10:55:14+03:00

Documentation This documentation cover the last release of jqGrid Upgrading * Upgrade from 3.8 to 4.0.0 * Upgrade from 3.6.4 to 3.6.5 * Upgrade from 3.4.x to 3.5 Installing jqGrid * Before you begin * System Requirements * Download jqGrid * Change Log * How to Install * How it Works * My First Grid Basic Grid * Conventions * Options :!: * colModel Options :!: * Data manipulation * Events :!: * Methods :!: * HOWTO :!: Navigating * Pager * Na…

wiki:jqgridexamples

2018-01-15T14:23:12+03:00

Working examples of jqGrid, with explanations, can be found here.

wiki:jquery_ui_intro

2013-05-27T13:17:05+03:00

jQuery UI Integrations Since jqGrid is a jQuery plugin it is very natural that in some cases we should not reinvent the wheel. That is the reason that we have made a decision to do some things in jqGrid using the wonderful jQuery UI library. Making this we believe that users will be happy.

wiki:jquery_ui_methods

2017-12-12T19:28:25+03:00

UI Integrations Sortable Columns This method is integrated in jqGrid, so there it is not necessary to do something special. The method allow to reorder the grid columns using the mouse. The only necessary setting in this case is to set the sortable option in jqGrid to true. using our example this will look like this:

wiki:methods

2018-02-02T22:53:54+03:00

Methods This chapter describes the basic methods of jqGrid. Some methods require that additional modules should be loaded. As of version 3.6 jqGrid uses new API which is compatible with jQuery UI library. See below. See also jqGrid Events Grid Related Methods

wiki:navigation

2013-03-21T18:54:10+03:00

* Introduction * Features * Documentation * Examples * FAQ * Help

wiki:navigator

2018-02-02T22:53:26+03:00

Navigator The Navigator is a user interface feature that allows easy accessibility to record actions such as Find or Edit. The user can activate a grid action by pressing the appropriate icon button in the Navigation layer. Developers can create custom actions, or they can use any of the six predefined actions that come with

wiki:nested_set_model

2017-12-12T19:21:18+03:00

Nested Set Model As discussed in previous chapter Configuration one of the important part is the treeReader property. Configuring this properly and understanding the basic concept of the nested set model will make your life easy. treeReader Configuration The default treeReader Configuration when we use tree grid with nested set model is:

wiki:options

2018-02-02T22:50:05+03:00

Options The setup and configuration of jqGrid are controlled by setting options for the grid. Examples of configuration settings include the height and width of the grid, type of data that should be in each column, and other similar settings. These options are set in the grid options array, and many of the options are set in

wiki:pager

2017-12-09T16:42:14+03:00

Pager If your grid has only a few rows of data, then all the records will be viewable at the same time and you won't have to worry about navigating through pages of data. But more likely, you will be dealing with large sets of data, and you'll want to display a small number of available records at a time. For this functionality, you will need the Navigation Bar.

wiki:pivotdescription

2017-12-12T19:23:27+03:00

What is a Pivot Table? A lot of definitions can be found in the web. More deeper information can be found In Wikipedia Simple we can say that pivot table is a program tool that allows you to reorganize and summarize selected columns and rows of data in a spreadsheet or database table to obtain a desired report.

wiki:pivotexample

2017-12-12T19:25:19+03:00

Pivot Example With this example we will try to explain and build pivot grid. We hope it will be clear, so that more user can have idea what is happen. Now - lets do first with the data. Data Let’s say that we have a table with sales data with the following fields:

wiki:pivotsettings

2017-12-12T19:24:10+03:00

Methods jqPivot jqPivotGrid has the following calling convention. jQuery("#grid").jqGrid('jqPivot', data, pivotoptions, gridoptions, ajaxoptions); Where #grid is the id of the table element as used in the jqGrid. data - can be a string or array of data to be passed to the pivot. In case the parameter is a string a ajax request is made. The data that should be returned should have a name value pair like this:

wiki:post_data_module

2017-12-09T19:34:46+03:00

| Documentation menu Post Data Module Sometimes there is a need to precisely manipulate the postData array. The setGridParam method does not in some cases do what we want. To do this we can use the Post Data module. Author Paul Tiseo Installation In order to use this module you should mark the Post methods (in Other modules) when you download the grid. For more information refer to

wiki:predefined_formatter

2018-02-02T22:52:56+03:00

Predefined Formatter Formatter supports advanced formatting of the contents of cells in form, in-line and cell editing. Formatter can be used in either of two ways: Predefined and Custom. In this section, we discuss the Predefined Formatter. jqGrid Module Requirements

wiki:retrieving_data

2012-09-18T18:26:40+03:00

Data Manipulation With the first release of jqGrid, the only possible way to obtain data was via XML as described in the tutorial above. Later, many people requested the ability to obtain data via JSON, then with an array and finally with 'real' names. After lot of work and with the help of the community we now have a wide range of methods for obtaining data.

wiki:search_config

2017-12-12T19:14:13+03:00

Configuration The columns in the grid can be used as the basis for a search form to appear above, below, or in place of, the grid. Searching is a way of querying data from the server using specified criteria. Currently we do not have module for searching on local data i.e when a datatype options is set to local. All the searching is done server side.

wiki:show_hide_columns

2017-12-12T19:26:41+03:00

| Documentation menu Description Display a modal window where the user can select which column to show and hide . Author Piotr Roznicki Installation In order to use this module you should mark the Set Columns plugin (in Other modules) when you download the grid. For more information refer to

wiki:singe_searching

2018-02-02T22:55:48+03:00

Single field searching Single field searching is a way to search data (at server) on one field at a time. When using this method we construct a modal form where the user can select a field and condition to apply the search. [ Singe Field serching] This method uses the url to post the search data and differ from the custom and toolbar search methods. The difference is that the posted search data is not in pair name:value. See below how data is posted.

wiki:subgrid

2011-08-30T12:06:41+03:00

Subgrid There are times when we need to be able to easily display (or edit) records that are the children of a selected record in the parent grid. We would, of course, want to show only those records that are the children of the selected record in the grid, never the children of all records.

wiki:subgrid_as_grid

2017-12-12T19:20:28+03:00

Subgrid as Grid This is not a ready for you method, but rather a solution using some of the available methods and events. In this alternative to a subGrid, we use the subGrid functions of the main grid to create not a subGrid, but another grid, with all of the power and capacity of the main grid but appearing, as before, under the

wiki:syntax

2009-11-28T10:08:04+03:00

Formatting Syntax DokuWiki supports some simple markup language, which tries to make the datafiles to be as readable as possible. This page contains all possible syntax you may use when editing the pages. Simply have a look at the source of this page by pressing the

wiki:system

2017-12-09T16:37:44+03:00

System Requirements You'll need the following: * Any modern web browser: Mozilla Firefox, Safari, Google Chrome, Opera, Microsoft Internet Explorer * jQuery library, version 1.3 or later:

wiki:table_to_jqgrid

2010-07-03T00:45:07+03:00

Description Convert existing html table to grid. Author: Peter Romianowski Installation In order to use this module you should mark the Table to Grid (in Other modules) when you download the grid. For more information refer to Download. For Developers - this is the grid.tbltogrid.js in the src directory.

wiki:toolbar_searching

2018-02-02T22:55:18+03:00

Toolbar Searching This method construct searching creating input elements just below the header elements of the grid. When the header elements are re sized the input search elements are also re sized according to the new width. The method uses the url option in grid to perform a search to the server.

wiki:treegrid

2017-12-12T19:20:52+03:00

TreeGrid Treegrid is a way to represent hierarchical data in grid. Treegrid supports both the Nested Set model and the Adjacency model. Good articles describing the Nested Set model can be found here: . Installation In order to use this module you should mark the Treegrid when you download the grid. For more information refer to

wiki:upgrade_from_3.4.x_to_3.5

2009-11-28T10:08:05+03:00

Upgrade from 3.4.x to 3.5 Installation The first change is related to installation. More detailed information can be found in How to Install Options The following grid options are deprecated - i.e. you can remove them from the grid options. They are not needed in 3.5 version

wiki:upgrade_from_3.6.4_to_3.6.5

2017-12-12T19:05:47+03:00

Upgrade from 3.6.4 to 3.6.5 You should read this upgrade notes when you use JSON response from the server. These notes are valid when you upgrade from any other version of jqGrid. With version 3.6.5 we switch from ajax complete to ajax success event.

wiki:upgrade_from_3.8_to_4.0.0

2017-12-12T19:05:23+03:00

Upgrade from 3.8.x to 4.0.0 1. The grid.postext.js module is no more supported. The module is moved to plugins directory. In case you want to use it you should include it manually. If you want to upgrade you code should be changed as follow: Old Method

wiki:welcome

2017-08-23T21:21:36+03:00

Welcome to your new DokuWiki Congratulations, your wiki is now up and running. Here are a few more tips to get you started. Enjoy your work with DokuWiki, -- the developers Create your first pages Your wiki needs to have a start page. As long as it doesn't exist, this link will be red: