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

Kendo UI Grid Ajax binding - Grid doesnot show data

1 Answer 40 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Prachi
Top achievements
Rank 1
Prachi asked on 11 Jan 2016, 04:59 PM

 $("#grid").kendoGrid({
                toolbar: ["excel"],
                excel: {
                    fileName: "Data_Export.xlsx",
                },

                dataSource: {                   
                    transport: {                     

                        read: {
                            //$.ajax({
                                type: "POST",
                                dataType: "json",
                                contentType: "application/json; charset=utf-8",
                                url: "Home.aspx/GetData",
                            
                                data: '{}',
                                success: function (response) {
                                    alert("hi");
                                },
                                error: function (response) {
                                    alert("error");
                                }
                            //})

                        },


                    },
                    schema: {
                        model: {
                            fields: {
                                iID: { type: "string" },
                                szName: { type: "string" }
                                

                            }
                        }
                    },
                    pageSize: 20,

                },
                height: 550,
                groupable: true,
                selectable: true,
                sortable: true,
                filterable: {
                    messages: {
                        clear: "Clear filter",
                    },
                    mode: "row"
                },
                pageable: {
                    refresh: true,
                    pageSizes: true,
                    buttonCount: 5
                },               
                columns: [{

                    field: "iID",
                    title: "iID",
                    width: 140,
                    filterable: {
                        cell: {
                            showOperators: true
                        }
                    }
                }, {
                    field: "szName",
                    title: "szName",
                    width: 140,
                    filterable: {
                        cell: {
                            showOperators: true
                        }
                    }
                }]

            });

 /////////////////////////////////////////////////////////////////////////////////////

 [WebMethod()]
        public static List<Records> GetData()
        {

            SqlDataReader dr;
            List<Records> recordsList = new List<Records>();



            using (SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["test"].ConnectionString))
            {
                using (SqlCommand cmd = new SqlCommand())
                {
                   
                    cmd.CommandText = "select [iID],[szName] from [Sprinter].[tblEmployee] ";
                    cmd.CommandType = CommandType.Text;
                    cmd.Connection = con;
                    con.Open();
                    dr = cmd.ExecuteReader(CommandBehavior.CloseConnection);
                    if (dr.HasRows)
                    {
                        while (dr.Read())
                        {
                            string ID = dr["iID"].ToString();
                            string Name = dr["szName"].ToString();


                            recordsList.Add(new Records
                                            {
                                                iID = ID,
                                                szName = Name,
                                                
                                            });
                        }
                    }
                }
            }
            return recordsList;
        }

Ajax call does not  execute success or error functions. The grid is empty. Can you please help what I am doing wrong.

1 Answer, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 13 Jan 2016, 11:53 AM

Hello Prachi,

 

The success callback will be overriden by the one attached from the transport. DataSource have change event which is wired to success of the request and error event that will be triggered if any error occurred for the request.

I would recommend you to use those events instead.

 

 

Regards,
Boyan Dimitrov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Prachi
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Share this question
or