Telerik RadGrid client-side data-binding using jQuery
Thursday, October 09, 2008
Instead of traditional ASP.NET AJAX approach for "Exposing Web Services to Client Script" you can use jQuery and JSON2 JavaScript libraries to achieve the same very easily.
Using this simple method you can call any page method in ASP.NET Page or WebService method:
function executeMethod(location, methodName, methodArguments, onSuccess, onFail) {
$.ajax({
type: "POST",
url: location + "/" + methodName,
data: methodArguments,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: onSuccess,
fail: onFail
});
}
Here is an example also how to use JSON2 JavaScript library to serialize any JavaScript object to string:
function getRequestData(tableView) {
return JSON.stringify({
"startIndex": tableView.get_currentPageIndex(),
"maximumRows": tableView.get_pageSize(),
"sortExpression": tableView.get_sortExpressions().toString(),
"filterExpression": tableView.get_filterExpressions().toDynamicLinq()
});
}
And to use these two to bind RadGrid you can simply call:
executeMethod("WebService.asmx", "GetData", getRequestData(tableView), updateGrid);
The result: Blazing fast and responsive AJAX DataGrid:
[Download]