RadListView supports client-side databinding to page methods and web services. Client-side
HTML templates are used to define the list view layout much the same as server-side
databinding. This particular example demonstrates a client-bound RadListView with
a grid layout databound to a page method. The method retrieves a list of all online
Telerik UI for ASP.NET AJAX demos.
Paging is enabled for the rendered grid layout with the help of a custom jQuery
data pager widget. The pager is rendered after the total item count is fetched through
a second page method call. Paging is implemented with the help of the client-side
RadListView.page() method. The client-side pager widget uses styles
from its server-side counterpart - RadDataPager.
To load control styles without loading the
control itself onto the page, we use RadStylesheetManager and its RegisterSkinnableControl
method in Page_PreRenderComplete in the code-behind.
The example also demonstrates how sorting can be implemented by attaching click
event handlers to table header cells. As jQuery is loaded by default when using RadListView, we can take advantage
of it when working with DOM events. Sorting is achieved by calling the client-side
RadListView.sort() method.
RadListView.page() and RadListView.sort() methods, as
well as a few others, automatically call the OnCommand event in RadListView.
We intercept the event by attaching a javascript event handler, cancel the command
to prevent postback, and make page method calls to rebind the list view.