What is a Grid?

Grid is a powerful data widget for displaying and editing large lists of related data. Grid provides fast and flexible rendering of data and includes built-in support for plug-ins, grouping, summary views, full in-place editing, custom column models,

and header menus (supporting hiding, sorting, and grouping). An example of Grid is shown.

Grid Example img.png

What is an Editable Grid?

Editable Grid is one of the functionality that RAPAPP platform provides. It is an enhancement for Simple Grid and provides a wide range of customizations.These abilities include settings like number of records to be displayed on a page(pagination), sorting column based on particular field, order and total row number, etc.

Features provided by the platform on the Grid?

If you want to make this grid Read-only then go to Customize Page.

  • Click on the Grid widget. It will display a property pallet which contains all the Grid properties. Now go through the properties and uncheck the update allowed checkbox.This makes the Grid read-only.

  • If you want to make the grid as Editable Grid then go to Customize Page. Click on the Grid widget. It will display a propertypallet which contains all the Grid attributes.Now go through the attributes and enable the Update Allowed Checkbox.

  • This makes your Grid Editable.
  • The column of a Grid can be populated with any of the Item types like: Column Config, Button, ComboBox, CheckBox, CustomSearchPanel, DataField, Email,InputSlider, LOVFieldLink, Multifield, NumberField, Phone, ReportMenuItem,Text, TextField, TextArea, SwitchColumnconfig, RichText, TipText.

On Grid data you can perform search based on the functionality of Search Criteria.

How to make use of Default Where Clause(Grid attribute)

  • Default Where Clause is an attribute of a Grid. It allows you to specify a standard SQL where clauses for the SELECT statement associated with a data source. These clauses are automatically appended to the SELECT statement that is constructed and issued whenever the user or the application executes a query for the Grid/Panel associated with this 'where clause' property. The reserved word WHERE is automatically prefixed to the statement.
  • WHERE clause can reference a field value at runtime as # {DataSource.attributeNameWithoutSpaceOrSpecialCharacters} or #{session.sessionAttribute}. For security reasons, you must use #attributeName# instead of the actual column name in the where clause.

Available session attributes:

  1. displayname.
  2. email.
  3. emailaddress.
  4. orgid.
  5. pageid.
  6. pagecode.
  7. sessionid.
  8. userid.
  9. username.
  To know more,refer Session variables.

Sample Where Clause:

#empId# = #{Employee.empId} AND #deptId# IN (100, 200) AND #createdBy# = #{session.userid}
#empId# = 100 AND EXISTS (SELECT 1 FROM MY_TABLE WHERE COLUMN1 = #{DataSource.attribute} AND Column2 = x.deptId)

  • At runtime, all the attribute names specified within "#" will be replaced with the actual column names. "X" is the default alias for the base table. All the values for the attributes used inside #{...} will be replaced with the actual values from the user's session/screen with bind values as shown below.


How to make use of Group By View(Grid attribute)

  • Group By View attribute is an attribute of a Grid.You can specify a view attribute by which the grid data can be grouped.

e.g. The below Applications Navigation grid is grouped by System Owner.

How to make use of Order By Clause(Grid attribute)

  • Order By Clause is an attribute of a Grid. It allows you to specify the SQL queries order by clause. The syntax to specify the order by clause is

#column1#[, #column2#] [asc/desc]

Example: If the Grid has a column by name Party Id, then order by clause can be specified as #partyid# desc

How to make use of Local/Server side Filtering

Filter:- Filter is used to view subset of data matching a criteria.

Local Filtering:- This filter is used to filter the data on the current page of the grid.

Server Side Filtering:- This filter is used to filter the data from entire grid store.

Local Filtering :- By default grid filters locally i.e., (On the Current Page). When a filter is appied on grid then only the data in the current page is considered.

Example:- Below is a screen shot of a grid which is filtered based on Status. When this filter is applied, only tasks that are ' Open' in the current Page are displayed.

For the same grid, if we enable server side filtering then as you can see below, it filters entire data and displays the output which naturally will result in more records in the page.

Server Side Filtering:- To enable server side filtering on a grid,

  • Go to Customise page.
  • In the Grid Attributes Uncheck the 'Local Filter' Property.

  • Then Click on Save

Example:- Below is the screen shot of the same grid with server side filter enabled and filtered on Status

Grid Properties

Auto Query                                                                                         Automatically executes the query on the Grid's Data Source thus pre-populating the data when the page is rendered. Make sure this property is checked for the child Grid, otherwise the child Grid will not
refresh when the parent record is changed. When defining master/child relationship, make sure the <a href="#Parent_Data_Source">Parent Data Source</a> is set and the Auto Query is checked.
Auto Height: It dynamically adjusts the grid’s height based on the number of records fetched.
Force Fit It adjusts the columns in the grid, so that the columns occupy entire grid width.
Group By View Attribute It helps you to group the rows in the grid based on any attribute you select.
Load Mask: If you want to display a loading message while the grid renders data then you can check load mask.
max Rows It determines the maximum number of rows that should be display in the grid . Example: If you have 100 records and you want to view 20 records at a time , then you can specify 20 as max rows and the remaining records are shown using page nation.
Show Advanced Search If you want advance search on the grid’s data then check this.
Show Column Lines It displays line between the columns in the grid.
Show Row Number It gives row number to each row.
Stripe Rows If you want striped grid rows then check it. i.e color of alternate rows differ .
Track Mouse Over When a user hovers over a row in the grid it gets highlighted.
Show Column Lines When this property is checked then the data of the grid will not be inserted or updated.
Populate Default Row When user unchecks this property grid will be rendered with an empty row.By default this property will be checked.
 Retain Active Record On Refresh:
  • By default this property is unchecked.
  • If this property is checked. Grid retains its last active record after refreshing the grid.
Transient Datasource When a user enables the transient data source property, it will not allow the user to do the insert,delete and update operations for that specific grid data source.
Wrap column header on grid If your header is too long then you can divide(wrap) the header by using wrap column header on grid.
Allow Multi Column Sort(Grid) By enabling the Allow Multi Column Sort property you can sort on multiple columns at a time.
Clear sort and no sort on grid columns These are the properties that will be visible on the Grid column where Allow Multi Column Sort property is checked for that grid.
Show Search On Header If you want to show the search screen icon on the grid header instead of having the search screen on top you need to enable the Show Search On Header property. So when you click the search icon on the grid a popup arises where you can perform search operation based on the required fields.

To know more about the properties of Grid, refer Common Properties.


101 California Street, Suite 2710
San Francisco, CA 94111

440 N. Wolfe Rd.
Sunnyvale, CA 94085

Office 11, 5th Floor, Building 9,
Mindspace IT Park
Hyderabad 500081

p: +1 (844) AT CloudIO (844-282-5683)
f: +1 (650) 300-5247 | e: sales@cloudio.io
© 2009, 2017 CloudIO Inc. | Terms of Use | Privacy Policy