如果按下添加按钮,如何将下拉列表添加到kendo弹出编辑器

时间:2017-09-23 22:29:07

标签: jquery kendo-ui kendo-grid

在我的kendo网格中,当我想添加新记录时,弹出添加窗口,我想在那里添加一个下拉列表,因为我只需要添加新记录就需要这个下拉列表,fowlloing方法不会工作,意味着我看不到下面的列表:

edit:function(e) { if (e.model.isNew() ) {    $("DeviceType" )
                              .appendTo(container)
                              .kendoDropDownList({                                    
                               dataTextField: "Text",
                               dataValueField: "Text",
                               valuePrimitive: true,
                               dataSource: mydata_deviceType,}}}

我的网格字段:

  columns: [
                                     { field: 'DeviceIP', title: 'DeviceIP', width: '100px', id: 'DeviceIP' },
                                     { field: 'Producer', title: 'Producer', width: '80px', id: 'Producer' },//editor: ProductNameDropDownEditor,
                                     { field: 'Model', title: 'Model', width: '220px', id: 'Model' },
                                     { field: 'DeviceType', title: 'DeviceType', width: '100px', id: 'DeviceType', editor: deviceTypesList },
                                     { field: 'Description', title: 'Description', width: '220px' },
                                     { field: 'Username', title: 'Username', width: '120px' },
                                     { field: 'Password', title: 'Password', width: '100px' },
                                     { field: 'PublicIP', title: 'PublicIP', width: '120px', id: 'PublicIP' },
                                     { field: 'TurbineId', title: 'TurbineId', width: '120px', id: 'TurbineId', hidden: true },
                                     { field: 'device_id', title: 'device_id', width: '120px', id: 'deviceid', hidden: true },
                                     { field: 'ModelProducer', title: 'Producer/Model', hidden: true, editor: modelProducer },
                                     {
                                         command: ["edit"], title: " "

                                     }
                            ],

modelProducer函数:

  function modelProducer(container, options) {


                           var t = modelProducerResult;

                            $('<input  name="ModelProducer" id="ModelProducer" data-type="string" style="width: 100%"\">')
                            .appendTo(container)
                            .kendoDropDownList({


                               dataSource: modelProducerResult,
                                dataTextField: "model",
                               dataValueField: "model",
                                valuePrimitive: true,                                   
                                change: upnChange

                            });

                            debugger;

                        }

1 个答案:

答案 0 :(得分:0)

您可以根据模式添加/或编辑添加编辑器。 只需更改您的编辑器功能:

function deviceTypesList(container, options) {
    if (options.model.isNew()) {
        $('<input name="' + options.field + '"/>')
                .appendTo(container)
                .kendoDropDownList({
                    dataTextField: "Text",
                    dataValueField: "Text",
                    valuePrimitive: true,
                    dataSource: mydata_deviceType
                });
    }
    else
    {
        $('<input type="text" class="k-input k-textbox" name="DeviceType"">')
                .appendTo(container);
    }
}

这是一个有效的演示http://dojo.telerik.com/IReWe

我希望它可以帮助你:)