telerik radgrid get_masterTableView()没有将json数据绑定到radgrid

时间:2014-10-31 07:10:54

标签: javascript asp.net telerik telerik-grid

我从客户端将json的列表绑定到telerik RadGrid。将数据对象绑定到radgrid的代码如下所示:

         <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script type="text/javascript">            
                function SetInTelerikGrid(data) {

                    var tableView = $find('<%=rgRetrievalList.ClientID %>').get_masterTableView();
                     tableView.set_dataSource(data);
                     tableView.dataBind();
                 }
            </script>
        </telerik:RadCodeBlock>

radgrid定义是:

      <telerik:RadGrid ID="rgRetrievalList"  runat="server"  >
           <MasterTableView TableLayout="Auto">
                  <Columns>
                      <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID" >
                      </telerik:GridBoundColumn>
                   </Columns>
              </MasterTableView>
      </telerik:RadGrid>

Here, as the code reached var tableView = $find('<%=rgRetrievalList.ClientID %>').get_masterTableView(); an error is thrown: Typeerror: cannot read property 'get_masterTableView()' of null. I do not know why it is note able  to take property get_masterTableView() of radgrid. Can anyone help me??    Thanks in advance..

1 个答案:

答案 0 :(得分:0)

当您尝试将Radgrid与JSON数据绑定时,这就是您遇到此错误的原因。

要解决此问题,您必须使用client side binding method绑定radgrid或为json数据绑定添加虚拟数据。

为json数据绑定添加虚拟数据:

<强> ASPX

<!DOCTYPE html>
<html>
<head runat="server">
    <title></title>
    <script src="Script/jquery-1.10.2.min.js"></script>
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">

            var GridData;

            function OnbuttonClient() {



                jQuery.ajax({
                    type: 'POST',
                    contentType: 'application/json; charset=utf-8',
                    data: '',
                    dataType: 'JSON',
                    url: 'Forum.aspx/BindGrid',
                    success: function (result) {

                        GridData = result.d;
                        if (GridData.length > 0) {
                            var divGridContainer = document.getElementById('divGridContainer');
                            divGridContainer.style.display = "";
                            var tableView = $find("<%= RadGrid1.ClientID %>").get_masterTableView();
                            tableView.set_dataSource(GridData);
                            tableView.dataBind();

                        }
                        else {
                            var divGridContainer = document.getElementById('divGridContainer');
                            divGridContainer.style.display = "none";
                        }
                    },
                    error: function () {
                        alert('Error on binding the data');
                    }
                });

                return false;
            }



        </script>
    </telerik:RadCodeBlock>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <telerik:RadScriptManager ID="RadScriptManager1" EnablePageMethods="true" runat="server">
            </telerik:RadScriptManager>
            <asp:Button ID="Button1" Text="Bind Grid" runat="server" OnClientClick="return OnbuttonClient();" />


            <div id="divGridContainer" style="display: none;">
                <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false">
                    <MasterTableView HierarchyLoadMode="Client" DataKeyNames="ID,ParentID" ClientDataKeyNames="ID,ParentID">
                        <Columns>
                            <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID">
                            </telerik:GridBoundColumn>

                        </Columns>
                    </MasterTableView>

                </telerik:RadGrid>
            </div>
        </div>
    </form>
</body>
</html>

<强> ASPX.CS

protected void Page_Init(object source, System.EventArgs e)
{


}

public void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        dynamic data = new[] {
            new { ID = "1", Name ="Name11",ParentID = "0"}
        };
        RadGrid1.MasterTableView.DataSource = data;
        RadGrid1.DataBind();
    }
}


protected void Page_PreRender(object sender, EventArgs e)
{

}




[WebMethod]
public static List<Employee> BindGrid()
{
    List<Employee> list = new List<Employee>(); ;

    Employee obj = new Employee();
    obj.ID = "1";
    obj.Name = "Name1";
    list.Add(obj);

    obj = new Employee();
    obj.ID = "2";
    obj.Name = "Name2";
    list.Add(obj);

    return list;
}


[Serializable]
public class Employee
{
    public string ID { get; set; }
    public string Name { get; set; }

}

请查看this链接了解详情。