如何使用剑道UI传输方法

本文关键字:传输 方法 UI 何使用 | 更新日期: 2023-09-27 17:49:45

在这里,我正在制作一个JSON数组列表,并成功返回国家的名称,剑道网格显示编辑选项,但不显示检索到的值?

 [WebMethod(EnableSession = true)]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true, XmlSerializeString = false)]
    public string coutryNames()
    {
        List<Dictionary<string, string>> list = new List<Dictionary<string, string>>();
        Dictionary<string, string> udemy = new Dictionary<string, string>();
        udemy.Add("92", "Pakistan");
        udemy.Add("91", "India");
        udemy.Add("90", "Afghanistan");
        udemy.Add("82", "Russia");
        udemy.Add("41", "China");
        udemy.Add("40", "Japan");
        udemy.Add("21", "UAE");
        udemy.Add("51", "Srilanka");
        list.Add(udemy);
        JavaScriptSerializer serializer = new JavaScriptSerializer();
        return serializer.Serialize(list);
    }

我正在阅读:

    $(function () {
              var dataSource = new kendo.data.DataSource({
                transport: {
                    read: {
                        url: "Countries.asmx/coutryNames", 
                        contentType: "application/json",
                        type: "GET"
                    },

我想的主要问题是在模式和模型,让我们看看:

   schema: {
                model: {
                    id: "id",
                    fields: {
                        id: { editable: true, nullable: true },
                        name: { validation: { required: true } }
                    }
                }

Kendo Grid我是这样显示的:

    $("#grid").kendoGrid({
            dataSource: dataSource,
            pageable: true,
            filterable: true,
            height: 400,
            toolbar: ["create"],
            columns: [
                      { field: "id", title: "Identification" },
                      { field: "name", title: "Country Name" },
                      { command: ["edit", "destroy"], title: "&nbsp;", width: "160px" }
            ],
            editable: "popup"
        });
    });

在测试期间JSON数据的格式为:

 <string xmlns="http://tempuri.org/"> 
 [{"92":"Pakistan","91":"India","90":"Afghanistan","82":"Russia","41":"China","40":"Japan","21":"UAE","51":"Srilanka"}]

如何在剑道网格中查看这个?

如何使用剑道UI传输方法

创建一个类,Country

public Country 
{
  public int Id {get; set;}  
  public string Name {get; set;}
}

然后,创建一个集合Country

public string coutryNames()
    {
        List<Country> list = new List<Country>();
        List.Add(new Country {Id = 92, Name = "Pakistan"});
        //etc
        JavaScriptSerializer serializer = new JavaScriptSerializer();
        return serializer.Serialize(list);
    }

你应该能够绑定到这个,因为JSON对象将具有匹配Kendo字段的属性。

这是一个完整的解决方案

 document.onreadystatechange = function () {

var viewModel = kendo.observable({
    products: new kendo.data.DataSource({

        transport: {
            read: {
                type: "GET",
                url: "/api/Companies/GetAllCompanies2",
                dataType: "json"
            },
            create: {
                 type: "PUT",
                    url: "/api/Companies/UpdateDefCompny",
                  contentType: "application/json; charset=utf-8",
                    dataType: "json",
                async: false
            },
            update: {
                url:"/api/Companies/SaveDefCompny",
                async: false,
                contentType: "application/json",
                dataType: "json",
                type: "POST"
                 // here you need correct api url
            },
            destroy: {
                url: "/api/Companies/Delete", // here you need correct api url
                dataType: "json"
            },

            parameterMap: function (data, operation) {
                if (operation !== "read" && data) {
                    return JSON.stringify(data.models[0]);
                }
            }
        },
        serverPaging: true,
        serverFiltering: true,
        pageSize: 10,
        schema: {
            //data:"Data",
            total: "Count",
            model: {
                id: "Id",
                fields: {
                    Id: { type: "int" },
                    CurrentCurrencyCode: { editable: true, type: "int" },
                    ShortName: { editable: true, type: "string" },
                    FullName: { editable: true, type: "string" },
                    ContactPerson: { editable: true, type: "string" },
                    Address1: { editable: true, type: "string" },
                    CompanyCity: { editable: true, type: "string" },
                    CompanyState: { editable: true, type: "string" },
                    CompanyCountry: { editable: true, type: "string" },
                    ZipPostCode: { editable: true, type: "string" },
                    TelArea: { editable: true, type: "string" }
                }
            }
        },
        batch: true,

    }) 

  });

       kendo.bind(document.getElementById("example"), viewModel);

      }