Setting RadGrid data source from client side

[Omar]

Hi,

I am trying to set the data source for grid from client side, Below is example of the code.

 

<telerik:RadGrid ID="Grid_geoData" runat="server" AutoGenerateColumns="false" Height="200px" >
           <MasterTableView DataKeyNames="Text" ClientDataKeyNames="Text" ShowHeadersWhenNoRecords="true" Visible="true">
                 <Columns>
                     <telerik:GridBoundColumn DataField="Text" HeaderText="Comp. name" UniqueName="comName" />
                 </Columns>
           </MasterTableView>
</telerik:RadGrid>

 

function pageLoad() {
            var data =
                [
                    { "ID": 1, "Text": "Text1" },
                    { "ID": 2, "Text": "Text2" }
                ];
            var mtv =  $find("<%= Grid_geoData.ClientID %>").get_masterTableView();
            mtv.set_dataSource(data);
            mtv.dataBind();
        }

I get error at line 

mtv.set_dataSource(data);

Do anyone have idea what I am doing wrong?

Regards,

Omar

 

[Vessy]

Hi Omar,

The masterTableView object is still not created in the moment when you try to bind it to the passed JSON data, thus the gird is not bound.

Passing some empty data source to the Grid in its NeedDataSource server-side event handler should allow you to bind the Grid successfully on the client-side in the pageLoad handler:

    protected void Grid_geoData_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        Grid_geoData.DataSource = new string[] { };
    }

Regards,
Vessy
Progress Telerik

[Omar]

Hi,

It solved my problem nicely.

Many thanks for the help.

Regards,

Omar

[Vessy]

You are welcome, Omar :) I am glad my reply was helpful.