This is a migrated thread and some comments may be shown as answers.

client side paging and sorting of RadGrid

12 Answers 1351 Views

Grid

This is a migrated thread and some comments may be shown as answers.

12 Answers, 1 is accepted

answered on 04 Dec 2008, 07:41 AM

Hi Jas,

You can enable client side sorting using the following approach.

CS:

    
             protected void RadGrid1_PreRender(object sender, EventArgs e) 
        
                { 
        
                    foreach (GridColumn col in RadGrid1.MasterTableView.RenderColumns) 
        
                    { 
        
                        foreach (GridHeaderItem header in RadGrid1.MasterTableView.GetItems(GridItemType.Header)) 
        
                        { 
        
                            header[col.UniqueName].Attributes.Add("OnClick", "return SortColumn('"+ col.UniqueName+ "');"); 
        
                        } 
        
                    } 
        
              }

JS:

    
            <script type="text/javascript"> 
        
                    function SortColumn(ColumnName) 
        
                    { 
        
                     var masterTable = $find("<%= RadGrid1.ClientID %>").get_masterTableView(); 
        
                      masterTable.sort(ColumnName); 
        
                    } 
        
                    </script>

One another suggestion will be to ajaxify the RadGrid using RadAjaxPanel or RadAjaxManager to prevent filckering on clicking the sort header/pager.

Regards
Shinu

answered on 08 Dec 2008, 01:03 PM

Jas, if what you want is to fetch the data ONCE (either in the code-behind or in the client via client-side data binding), and allow sorting and paging on the client thereafter without fetching the data again, you simply cannot achieve this.

Yavor's example performs paging and sorting on the server via client-side binding. It is NOT the same as performing paging or sorting ON THE CLIENT.

With that aside, I'm curious as to why you would want paging to be done 100% clientside? One of paging's purpose is to only fetch the subset of data you need so as not to bog down memory (either in the browser or in the ViewState).