The CellClick Event

The CellClick class lets you detect clicks on cells and rows in Table and DataGrid tables. This class attaches a JavaScript event to the table which detects clicks that bubble up to it. It accepts a parameter that lets you specify what information to send to the action that handles the click event.

The action parameter is a JavaScript code fragment whose 'this' variable is defined as the object clicked on. CellClick also has some predefined constants that let you return the row index or id that was clicked, the column index or id, or the cell id. It also has some helper functions — RowDataValue and CellDataValue — that will return the value of a 'data-*' attribute that is attached to the row or cell tags.

In the example, you can click on any of the rows, and the id of the row clicked on will be past to the action. The action then looks up the person clicked on and displays the person's name in a dialog. If you examine the html source generated, you will see that each row is given a 'data-value' attribute that is the id of the person being clicked on. The CellClick reads that value and sends it to the action handler.

First Name
Last Name
JohnDoe
KendallPublic
BenRobinson
MikeHo
AlexSmith
WendySmith
KarenWolfe
SamanthaJones
LindaBrady
JenniferSmith
BrettCarlisle
JacobPratt
58
58
58
5741787887
JosephBiden
JosephBiden
JosephBiden
sdbvasdgvb
sdbvasdgvb