编辑后,Kendo Grid单元格不会更改

时间:2017-07-10 14:28:44

标签: jquery kendo-grid

在我的网格中我有一个弹出式编辑器有一个下拉列表,但当我从下拉列表中选择一个项目时,在网格中它显示“对象对象”,我的下拉列表,在第一个下面的代码我从Ajax获取数据以填充我的网格:正如您所看到的,当我从Drlist中选择一个生产者时,它给出null,它在值为null时发生

$(document).keypress(function (e) {
    var mydata;
    var mydata_deviceType;
    if (e.which == 13) {

        var drp = document.getElementById('autocomplete').value;

        $.ajax({
            dataType: "json",
            type: "POST",
            url: "@Url.Action("turbineDeviceDetail","AdminTool")",
            contentType: "application/json; charset=utf-8",
            data: JSON.stringify({ "turbine": drp, }),

            success: function (result){

                    var flg = "s";
                    $.ajax({
                        dataType: "json",
                        type: "POST",
                        url: "@Url.Action("producersDevice","AdminTool")",
                        contentType: "application/json; charset=utf-8",
                        data: JSON.stringify({ "flg": flg, }),

                        success: function (data) {
                            mydata = data;
                        }
                    })


$("#turbingrid").kendoGrid({

                    dataSource: result,

                    //editable: "inline",
                    //editable: true,
                    //height: 'auto',
                    scrollable: false,
                    //toolbar: ["save", "cancel"],
                    //sortable: { mode: "single", allowUnsort: true },

                    columns: [
                                          { field: 'DeviceIP', title: 'DeviceIP', width: '100px', id: 'DeviceIP' },
                                          { field: 'Producer', title: 'Producer', width: '80px', editor: ProductNameDropDownEditor },
                                          { field: 'Model', title: 'Model', width: '120px' },
                                          { field: 'DeviceType', title: 'DeviceType', width: '100px', editor:deviceTypesList },
                                          { field: 'Description', title: 'Description', width: '100px' },
                                          { field: 'Username', title: 'Username',width:'120px' },
                                          { field: 'Password', title: 'Password', width: '100px' },                                          
                                          { field: 'PublicIP', title: 'PublicIP', width: '120px' },
                                          { command: ["edit"], title: " ", width: "100px" }],
                    editable: "popup",
                    edit:
                        function() {
                            document.getElementsByName("DeviceIP")[0].disabled = true;

                        },                          
                    editable: "popup"
                });



                function ProductNameDropDownEditor(container, options) {

 here is the grid:           

                    $('<input  name="Producer" data-type="string"\">')
                      .appendTo(container)
                      .kendoDropDownList({
                          dataSource: mydata,
                          dataTextField: "Text",
                          dataValueField: "Text",


                      });



                }

As you see when I select a producer from Drlist,it gives null,it happens when the value is null

1 个答案:

答案 0 :(得分:0)

根据上面已经确定的内容,我相信您在Producer的列定义中缺少template属性,该属性用于指定要在对象中显示的数据,源自此Kendo example

将此template属性添加到网格列定义中,如下所示:

{ field: 'Producer', title: 'Producer', width: '80px', editor: ProductNameDropDownEditor, template: "#=Producer.Text#" },

此外,您可能需要为下拉控件实际声明dataSource,如下所示:

function ProductNameDropDownEditor(container, options) {
    var dataSource = new kendo.data.DataSource({
        data: mydata
    });
    $("<input name='" + options.field + "' data-text-field='Text' data-value-field='Text' data-bind='value:" + options.field + "'/>")
        .appendTo(container)
        .kendoDropDownList({
            dataSource: dataSource,
            dataTextField: "Text",
            dataValueField: "Text",
        });
    }
}

让我知道结果。

修改

如果Producer对象在mydata内可以为空,则需要使用template函数执行一些额外的验证,例如:

{ field: 'Producer', title: 'Producer', width: '80px', editor: ProductNameDropDownEditor, template: getProducerText },

function getProducerText(dataItem) {
    return dataItem.Text ? dataItem.Text : "No producer found";
}