Kendo ui 网格下拉列表填充对象对象答案

【问题标题】：Kendo ui grid dropdownlist populate object objectKendo ui 网格下拉列表填充对象对象
【发布时间】：2014-02-23 12:06:43
【问题描述】：

我正在尝试实现 Cakephp 剑道 ui 网格下拉列表来编辑列 partner_type_id 但卡住导致下拉列表填充 [object][object]。

这是我的代码：

$(function() {
    var dataSource = new kendo.data.DataSource({
        batch: true,
        pageSize:10,        
        transport: {
            read: {
                url:"<?php echo $this->Html->url('/Partners/get_partner',true)?>",
                dataType:"json",
            }
        },
        schema: {
            id:"Partner.id",
        }
    });     

    $("#grid").kendoGrid({
        dataSource: dataSource,             
        columns: [
            { field: "Partner.name"},
            { field: "Partner.partner_type_id", 
             template: "#: PartnerType.name #", editor: categoryDropDownEditor
            },
            { command: ["edit"], title: "&nbsp;", width: "182px" }
        ],
        toolbar: ["create", "save", "cancel","destroy"],
        height: 400,
        navigatable: true,
        pageable: {
            refresh: true,
            pageSizes:true
        },
        editable:"inline" ,    
        filterable: {
            extra: false,
            operators: {
                string: {
                    startswith: "Starts with",
                    eq: "Is equal to",
                    neq: "Is not equal to"
                }
            }
        },       
    });      

    function categoryDropDownEditor(container, options) {
        $('<input required required data-text-field="PartnerType.name" data-value-field="Partner.id" data-bind="value:' + options.field + '"/>')
        .appendTo(container)
        .kendoDropDownList({
            autoBind: false,
            dataSource: {
                transport: {
                    read: {
                        url:"<?php echo $this->Html->url('/Partners/get_partner_type',true)?>",
                        dataType:"json",
                    }    
                },
            },
        });
    }      
});

你知道我使用嵌套的 JSon，有问题吗？我尝试过使用具有相同代码的原生 PHP 和 MySql（平面 Json）并且运行良好。

/Partners/get_partner 返回以下： [ {“合作伙伴”：{“id”：“1”，“name”：“King James”，“partner_type_id”：“2”}，“PartnerType”：{“id”：“2”，“name”： “供应商”} } ]

/Partners/get_partner_type' 返回如下： [ {"PartnerType":{"id":"1","name":"Customer"}}, {"PartnerType":{"id":"2","name":"Vendor"}} ]

有人愿意分享吗？

【问题讨论】：

您能否举例说明您的下拉列表服务返回了什么？
截图如下：s807.photobucket.com/user/excelf/media/screenshots/…
我的意思是JSON...如果您在浏览器中打开“.../Partners/get_partner_type”，JSON 是什么样的？我的理论是，问题在于 JSON 的结构，它不仅是字符串数组，而且是对象。 BUT 在 DataSource 定义中，您既没有指定 dataTextField 也没有指定 dataValueField，因此 KendoUI 无法显示正确的信息
[ { "Partner":{"id":"1","name":"King James","partner_type_id":"2"}, "PartnerType":{"id": "2","name":"供应商"} } ] [ {"PartnerType":{"id":"1","name":"Customer"}}, {"PartnerType":{"id":" 2","名称":"供应商"}} ]
您的 JSON 无效，您返回两个数组而不是一个。你能检查一下你的服务吗？

标签： cakephp kendo-ui kendo-grid kendo-dropdown

【解决方案1】：

您似乎遇到了名称不匹配的问题编辑器名称应与网格字段名称匹配在您的情况下，该字段是

合作伙伴{ 合作伙伴 ID，合作伙伴姓名； }

因此，通过您的代码使其保持一致，如下所示，其他明智的编辑器列将保持显示 [object object] 因为它找不到正确的属性名称

$(function() {
var dataSource = new kendo.data.DataSource({
   batch: true,
     pageSize:10,       
     transport: {
         read: {
                url:"<?php echo $this->Html->url('/Partners/get_partner',true)?>",

                dataType:"json",
         }

     },

schema: {

  id:"PartnerID",
  Patner: { defaultValue: { PartnerID: 1, PatnerName: "Jhon Doe"} }


}

});

$("#grid").kendoGrid({
  dataSource: dataSource,               
    columns: [

    { field: "Partner.PatnerName"},
    { field: "Partner", 
         editor: categoryDropDownEditortemplate: "#= Partner.PatnerName #"
    },
    { command: ["edit"], title: "&nbsp;", width: "182px" },

 ],

function categoryDropDownEditor(container, options) {
    $('<input required required data-text-field="PatnerName" data-value-field="PartnerID" data-bind="value:' + options.field + '"/>')
        .appendTo(container)
        .kendoDropDownList({
            autoBind: false,
            dataSource: {

                transport: {
                     read: {
                            url:"<?php echo $this->Html->url('/Partners/get_partner_type',true)?>",
                            dataType:"json",
                      }    
                },


            },

        });
}

【讨论】：

[ { "Partner":{"id":"1","name":"King James","partner_type_id":"2"}, "PartnerType":{"id": "2","name":"供应商"} } ]
[ {"PartnerType":{"id":"1","name":"Customer"}}, {"PartnerType":{"id":"2","name" :"供应商"}} ]

【解决方案2】：

在具有可编辑下拉列表的剑道网格中，问题在于网格数据源中下拉列表字段的值。（不是下拉列表的数据源）。

如果该字段的值为空，则在您尝试编辑它时显示[object Object]。

在填充数据源时，我通过为字段设置默认值（如果为 null）解决了这个问题。

选择第 1 列，第 2 列， ISNULL(ParterName, '') AS ParterName FROM 表名

【讨论】：