javascript 将项目添加到 kendoDropDownList

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/30200750/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 11:53:03  来源:igfitidea点击:

Add Item To kendoDropDownList

javascriptjquerykendo-uikendo-dropdown

提问by Hector

I am trying to add a item to the kendoDropDownList, it seems to add the option but not set the value and text. Inspecting the select it just adds a new option

我正在尝试向 kendoDropDownList 添加一个项目,它似乎添加了选项但没有设置值和文本。检查选择它只是添加了一个新选项

 <option></option>

Here is what I am using

这是我正在使用的

 $("#nameList").data("kendoDropDownList")
     .dataSource.add({ "text": "Joe", "value": "Joe" });

UPDATE

更新

Here is my datasource model and the requestEndas suggested but the values seem to get messed up

这是我的数据源模型和requestEnd建议的但值似乎搞砸了

datasource_people = new kendo.data.DataSource({
        type: "json",
        serverFiltering: true,
        transport: {
            read: {
                dataType: 'json',
                type: 'GET',
                url: '/restful/people/'
            }
        },
        filter: {
            field: "status",
            operator: "eq",
            value: 1
        },
        schema: {
            data: function(response) {
                return response.data.plaintiffs;
            },
            model: {
                id: "person_id",
                fields: {
                    person_id: {type: "number"},
                    name: { type: "string"}
                }
            },
            errors: "error",
            total: function(response) {
                return response.data.total;
            }
        }
    });

Then Later

然后后来

$("#people_list").kendoDropDownList({
                    dataTextField: "text",
                    dataValueField: "value",
                    dataSource: {
                        datasource_people,
                        requestEnd: function (e) {
                            e.response.push({text: "John", value: "John"});
                        }
                    }
                });

回答by Hector

After some searching it was quite simple but this worked for exactly what i needed.

经过一番搜索后,它非常简单,但这正是我所需要的。

$("#people_list").getKendoDropDownList().dataSource.insert({
    person_id: "John",
    name: "John"
})

回答by Rick S

You can add a new item to the datasource after it has been loaded using requestEnd.

您可以在使用requestEnd加载新项目后向数据源添加新项目。

requestEnd: function (e) {
  e.response.push({text: "Joe", value: "Joe"});
}

I've updated the other user's fiddle to show you it works. jsFiddle example

我已经更新了其他用户的小提琴以向您展示它的工作原理。 jsFiddle 示例

回答by Harutyun Abgaryan

Use this:

用这个:

<input id="nameList" value="1" />
var data = [
    { text: "Joe", value: "Joe" },
    { text: "Joe", value: "Joe"  },
    { text: "Joe", value: "Joe"  }
];

// create DropDownList from input HTML element
$("#nameList").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: data,
    index: 0,         
});

DEMO

演示

回答by Nicholas

Not sure what exactly you want, but you can load options from a datasource, and then append more to the list after dataBoundhas fired.

不确定您到底想要什么,但您可以从数据源加载选项,然后在dataBound触发后将更多选项附加到列表中。

$("#nameList").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: {
        transport: { 
            read: { 
                dataType: 'json', 
                type: 'GET', 
                url: '/restful/companies' 
            }
        } 
    },
    dataBound:onDataBound
});

<script>
    function onDataBound(e) {
        e.sender.dataSource.add({ "text": "Joe", "value": "Joe" });
    }
</script>