如何从下拉列表中获取所选名称的ID
选择Apples
然后选择1
,然后选择Oranges
,然后选择2
。
这是简单的剑道下拉示例。
<body>
<input id="dropdownlist" />
<script>
$("#dropdownlist").kendoDropDownList({
dataSource: [
{ id: 1, name: "Apples" },
{ id: 2, name: "Oranges" }
],
dataTextField: "name",
dataValueField: "id",
index: 1,
select: onSelect
});
function onSelect(e) {
console.log(e);
};
</script>
</body>
感谢。
答案 0 :(得分:5)
要检索所选的ID,您可以使用dataItem
对象并使用change
事件访问其中的ID:
var dataItem = e.sender.dataItem();
$('#id').text(dataItem.id);
这也可以让您访问对象中的任何数据:
$('#name').text(dataItem.name);
工作示例
<强> HTML 强>
<input id="dropdownlist" /><br/>
<span id="id" >Id</span><br/>
<span id="name" >Name</span><br/>
<强>的JavaScript 强>
$("#dropdownlist").kendoDropDownList({
dataSource: [
{ id: 1, name: "Apples" },
{ id: 2, name: "Oranges" }
],
dataTextField: "name",
dataValueField: "id",
index: 1,
change: onChange
});
function onChange(e) {
var dataItem = e.sender.dataItem();
$('#id').text(dataItem.id);
$('#name').text(dataItem.name);
};
答案 1 :(得分:3)
Select事件使用起来有点困难,因为该事件在选择项目之前触发。
如果您使用Change事件,您应该能够使用
获取dataItemthis.dataSource.get(this.value())
答案 2 :(得分:2)
请使用this.dataItem()
function onSelect(e) {
alert(this.dataItem().id);
alert(this.dataItem().Name);
};
答案 3 :(得分:0)
要选择所选项目的ID,请使用:
$("#dropdownlist").val()
要选择所选项目的TEXT,请使用:
$("#dropdownlist").data("kendoDropDownList").text()