Manually updating the grid: Ajax

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

0 Answers 59 Views

Grid

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

This question is locked. New answers and comments are not allowed.

jessenaiman asked on 29 Jun 2010, 05:50 PM

The grid loads correctly for paging, but fails when we try to manually update the grid after a search is performed.

Is there an alternative that works better, but still allows client side searching?

Here's our code:

                    <%          
                 GridPagerStyles pagerStyles = GridPagerStyles.NextPreviousAndNumeric;%>         
                 <%=         
                 Html.Telerik().Grid<ExternalContactModel>()         
                    .Name("Contacts")                 
                            .Columns(columns =>         
                            {         
                                columns.Bound(c => c.AllStarContactId)         
                                    .ClientTemplate("<input type='radio' class='sourceSelector' name='<#= AllStarContactId #>' checked='checked' disabled='true' value='<#= AllStarContactId #>'  />").Title("").Width(50);         
                                columns.Bound(p => p.Name).Title("Name");         
                                columns.Bound(p => p.Email).Title("Email");         
                                columns.Bound(p => p.Source).Title("Source").Width(65);                              
                            })         
                            .DataKeys(keys => keys.Add(c => c.Id))         
                            .DataBinding(dataBinding => dataBinding.Ajax().Select("_ContactList", "EmployeeSettings"))         
                                     .Groupable(settings => settings.Groups(groups =>         
                                     {         
                                         groups.Add(o => o.Name);         
                                     }))         
                            .Pageable(paging=>paging.Style(pagerStyles))         
                            .Scrollable(p => p.Height(400))         
                                     
                             
                %>         

                    function GetFilteredContacts() {         
                    var query = $('#SearchBox').val();         
                    $.post('/EmployeeSettings/Search',         
                            { q: query },         
                            function (data) {         
                                $('#Contacts').data('tGrid').dataBind(data.data);         
                                $('#Contacts').data('tGrid').total = data.data.length;         
                                $('#Contacts').data('tGrid').updatePager();         
                            });         
                }         

After further inspection it looks like the grouping is being thrown off. However if I look at the javascript object I can see that it is still set.

I've solved my problem following the steps in this post