将Kendo数据源与从C#MVC控制器操作调用的异步$ .ajax绑定 [英] Binding Kendo Data Source with Async $.ajax calling from C# MVC Controller Action

问题描述

这是我在控制器中执行的操作.返回List>转换为DataSourceResult，并序列化为Json.

This is my action in controller. Which return a List> converting into DataSourceResult.and also Serializing into Json.

[HttpPost]
public ActionResult GetMissingShiftData([DataSourceRequest]DataSourceRequest request)
{
    DataTable dtResponse = new DataTable();
    var dynamicList = new List<dynamic>();
    var myMainList = new List<List<dynamic>>();
    List<DataSourceResult> viewResultList = new List<DataSourceResult>();

    string RigNumber = string.IsNullOrWhiteSpace( resultData.Filter.SelectedRig.RigNumber) ||  resultData.Filter.SelectedRig.RigNumber == "ALL" ? "" :  resultData.Filter.SelectedRig.RigNumber;

    DataSet response = MissingShiftsReportData.GetData(Convert.ToDateTime(resultData.Filter.DateStart), Convert.ToDateTime(resultData.Filter.DateEnd), ConnString, RigNumber);


    foreach (DataTable dt in response.Tables)
    {

        dtResponse = dt;

        string[] columnNames = dtResponse.Columns.Cast<DataColumn>().Select(x => x.ColumnName).ToArray();


        foreach (DataRow dr in dtResponse.Rows)
        {
            dynamic myObj = new ExpandoObject();
            var p = myObj as IDictionary<string, object>;
            Regex rgx = new Regex("[^a-zA-Z0-9]");
            for (int i = 0; i < columnNames.Length; i++)
            {
                string name = dr.Table.Columns[i].ColumnName.Replace(" ", String.Empty);
                name = name.Replace(".", String.Empty);
                name = name.Replace("(", String.Empty);
                name = name.Replace(")", String.Empty);
                name = rgx.Replace(name, "");
                p[name] = dr[i];

            }
            dynamicList.Add(p);
        }
        myMainList.Add(dynamicList);


    }
    DataSourceResult viewResult = myMainList.ToDataSourceResult(request);

    string JsonViewData = JsonConvert.SerializeObject(viewResult.Data);           
    return new ContentResult { Content = JsonViewData, ContentType = "application/json", ContentEncoding = Encoding.UTF8 };
}

这是我对Jqery所做的异步调用.当我尝试绑定数据源时，它显示"data [0] .Data"为"undefined".如何使用数据".

And this is the async call I am doing with Jqery.while I am trying to bind a data source it shows "data[0].Data" is "undefined". How can I make use of 'data'.

$.ajax({
    url: "GetMissingShiftData",
    type: "post",
    datatype: 'json',
    success: function (data) {
        var list = data[0].Data;
        var dataSource = new kendo.data.DataSource({
            data: data[0].Data
        });
        dataSource.read();
        return false;
    },
    error: function (msg) {
        toastr.error("Error: " + msg.statusText);
    }
});

推荐答案

您正在序列化一个数组(Data属性)，不需要在客户端使用Data字段:

You are serializing an array (the Data property) and don't need to use the Data field at the client-side:

$.ajax({
    url: "GetMissingShiftData",
    type: "post",
    datatype: 'json',
    success: function (data) {
        var dataSource = new kendo.data.DataSource({
            data: data
        });
        dataSource.read();
        return false;
    },
    error: function (msg) {
        toastr.error("Error: " + msg.statusText);
    }
});

这篇关于将Kendo数据源与从C#MVC控制器操作调用的异步$ .ajax绑定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！