We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Using custom logics for grid cell customization

How to use custom logics for grid cell customization?

Customize Grid cells such as cell formatting, cell text, etc., with user’s custom logic

Solution               

For cell level customization queryCellIfo” event can be used. It have option to apply our own custom logics to cell formatting and text corrections. The “queryCellInfo” event will be triggered for every cell in grid with complete information about cell and arguments for transforming particular cell. Its event arguments are listed below

Name

type

Description

Cell

object

Returns grid cell.

Cancel

boolean

Returns the cancel option value.

Data

object

Returns current row record object (JSON).

Text

string

Returns the text value in the cell.

Column

object

Returns the column object.

foreignKeyData

Object

Returns the foreign key record object (JSON).

Model

object

Returns the grid model.

Type

string

Returns the name of the event.

 

The below highlighted code is example for user can customize the cell through queryCellInfo event. In this example, we explain about how to change “Customer ID” column background color as “lightblue”, and the font color as a “green” using custom CSS. In “Employee ID” column the font color set as “red” using custom CSS if the value is greater than 3.

Please find the code snippet for initialize “queryCellInfo” event in Grid.

 

 

 

 

 

 

 

 

 

Please find the JavaScript Code for queryCellInfo.

 

 

 

Screen Shot:

Article ID: Published Date: Last Revised Date: Platform: Control:
2620 11/12/2014 12/24/2014 JavaScript ejGrid
Tags:
Did you find this information helpful?
Add Comment
You must log in to leave a comment

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon