WebGrid provides a set of comprehensive client side API to let developers extend
the Grid for their own use.
In this topic, you will learn how to use several basic Client-Side APIs.
To get WebGrid object
Use ISGetObject function to get the client object reference of
any Intersoft’s components, instead of using different function for each.
This topic will show you how to get WebGrid's object using ISGetObject.
- Drag WebGrid instance into the WebForm.
- Add a Client-Side function.
var grid = ISGetObject("WebGrid1");
|
To get WebGrid selected row
Use GetSelectedObject function to get selected row in WebGrid via
client side.
This topic will show you how to get WebGrid's selected row object using GetSelectedRow
function.
- Drag WebGrid instance into the WebForm.
- Add a Client-Side function.
var grid = ISGetObject("WebGrid1");
var selectedObject = grid.GetSelectedObject().GetRowObject();
|
- Select a row.
To get WebGrid's row by KeyValue
Use GetRowByKeyValue function to get WebGrid's row by KeyValue
in client side.
This topic will show you how to get WebGrid's row using GetRowByKeyValue.
- Drag WebGrid instance into the WebForm.
- Add a Client-Side function.
function RowObject()
{
var grid = ISGetObject("WebGrid1");
var row = grid.RootTable.GetRowByKeyValue("VINET"); // get WebGridRow object by key value.
}
|
To set WebGrid's cell text
When you want to set a text into a cell in WebGrid, you can
use SetText function in client side.
This topic will show you how to set WebGrid's cell text.
- Drag WebGrid instance into the WebForm.
- Add a Client-Side function.
function SetText()
{
var grid = ISGetObject("WebGrid1");
var row = grid.RootTable.GetRowByKeyValue("SPLIR"); // get WebGridRow object by key value.
var cells = row.GetCells();
row.Select();
cells.GetNamedItem("ContactTitle").SetText("Owner", true); // change contact title cell to Owner.
}
|
To call SendCustomRequest() from client side
Custom OnTheFlyPostback from client side to server side can be called using a function
called SendCustomRequest.
This topic will show you how to set SendCustomRequest.
- Drag WebGrid instance into the WebForm.
- Add a Client-Side function .
function Grid1_ButtonClick()
{
var grid = ISGetObject("WebGrid1");
grid.SendCustomRequest();
return true;
}
|
To show/hide WebGrid
When you want to set WebGrid visible/invisible, you can use Show
or Hide functions in client side.
This topic will show you how to show or hide WebGrid.
- Drag WebGrid instance into the WebForm.
- Add a Client-Side function on your code.
function showGrid()
{
var grid = ISGetObject('WebGrid1');
grid.Show();
}
function hideGrid()
{
var grid = ISGetObject('WebGrid1');
grid.Hide();
}
|
To select WebGrid's row from Client-Side
Use Select function to select a WebGrid row in client side.
This topic will show you how to select WebGrid's row.
- Drag WebGrid instance into the WebForm.
- Add a Client-Side function.
function SelectRow()
{
var grid = ISGetObject("WebGrid1");
var row = grid.RootTable.GetRowByKeyValue("VINET"); // get WebGridRow object by key value.
row.Select(); // select this row for focus
}
|
To get value from hidden column using HiddenDataMember
Use client side function to get value from hidden column on WebGrid.
This topic will show you how to get the value.
- Drag WebGrid instance into the WebForm.
- Set HiddenDataMember property to one of column you want to hide, for example : City.
- Add a Client-Side function.
function getdata()
{
var grid = ISGetObject("WebGrid1");
var rowObj = grid.GetSelectedObject().GetRowObject();
var cells = rowObj.GetCells();
var customer = cells.GetNamedItem("CustomerID");
var city = customer.GetElement().attributes["City"].value;
alert(city);
}
|
- Select a row.