如何从选定的下拉列表中获取另一个值
How to get another value from the selected dropdownlist
我有项目的class
public class Project
{
public int Id { get; set; }
public string Name { get; set; }
public string Description { get; set; }
}
然后,使用下拉列表显示
@Html.DropDownListFor(model => model.Id,
new SelectList(Model.Projects, "Id", "Name", Model.Id),
"-- Select --",
new { @class = "form-control" })
如果我select一个项目,我可以得到Id和Name,但是如何得到描述?
<script>
$(function () {
$('#id').change(function () {
alert('id = ' + $('#Id').val() + ', name = ' + $('#Id :selected').text() + ', description = ' + ???);
});
});
</script>
有两种方法
如果项目列表非常大,您将必须创建 API 并使用 ajax 获取描述。
在javascript中从模型中获取项目列表并找到描述
<script>
var projects = @Html.Raw(Json.Encode(Model.Projects));
console.log(JSON.stringify(projects)); //only for test
$(function () {
$('#id').change(function () {
let id= $('#Id').val();
let description = null;
let name = null;
projects.forEach((item) => {
if (item.Id === id) {
name= item.Name;
description= item.Description;
break;
}
});
alert('id = ' + id + ', name = ' + name + ', description = ' + description);
});
}
</script>
我有项目的class
public class Project
{
public int Id { get; set; }
public string Name { get; set; }
public string Description { get; set; }
}
然后,使用下拉列表显示
@Html.DropDownListFor(model => model.Id,
new SelectList(Model.Projects, "Id", "Name", Model.Id),
"-- Select --",
new { @class = "form-control" })
如果我select一个项目,我可以得到Id和Name,但是如何得到描述?
<script>
$(function () {
$('#id').change(function () {
alert('id = ' + $('#Id').val() + ', name = ' + $('#Id :selected').text() + ', description = ' + ???);
});
});
</script>
有两种方法
如果项目列表非常大,您将必须创建 API 并使用 ajax 获取描述。
在javascript中从模型中获取项目列表并找到描述
<script>
var projects = @Html.Raw(Json.Encode(Model.Projects));
console.log(JSON.stringify(projects)); //only for test
$(function () {
$('#id').change(function () {
let id= $('#Id').val();
let description = null;
let name = null;
projects.forEach((item) => {
if (item.Id === id) {
name= item.Name;
description= item.Description;
break;
}
});
alert('id = ' + id + ', name = ' + name + ', description = ' + description);
});
}
</script>