关于jquery：ASP.NET MVC列表框处理选定的项目事件

ASP.NET MVC Listbox handling selected item events

我正在这样的视图中使用HTML.ListBox：

1	<%= Html.ListBox("projects", Model.Projects) %>

在模型中以IEnumerable <SelectListItem>填充，例如：

1
2
3
4
5
6
7
8

Projects = project.Select(a => new System.Web.Mvc.SelectListItem
{
Value ="foo",
Text = a.project +"(" + a.count +")",
Selected = false
});

return Projects;

这又返回到控制器以传递到强类型视图。

我的问题是，如何监视选定项目的事件？当用户进行选择和/或取消选择时，我需要能够执行一些操作。

谢谢。

如果您熟悉jQuery，甚至可以捕获更改并提交FORM：

1
2
3

$('#projects').change(function () {
$(this).parents('form').submit();
});

或者您可以使用ajax将某些数据提交给操作

1
2
3
4
5
6
7
8
9
10
11

$('#projects').change(function () {
$.ajax({
type: 'POST',
url: '<%=Url.Action("","<controller>")%>',
data: { id: $('#projects').val() },
dataType: 'json',
complete: function(XMLHttpRequest, textStatus) {
// Do something here.
}
});
});

更新：

由于您使用的是jQuery Dropdown Check List，因此您甚至可以捕获onItemClick并调用控制器的操作，以传递所选选项的值以及已检查/未检查的状态：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

$("#projects").dropdownchecklist({
emptyText:"select something",
width: 150,
onItemClick: function(checkbox, selector){
var isChecked = checkbox.prop("checked");
alert("element id:" + checkbox.prop("value"));

$.ajax({
type: 'POST',
url: '<%=Url.Action("","<controller>")%>',
data: { selecteId: checkbox.prop("value"), isChecked: isChecked },
dataType: 'json',
complete: function(XMLHttpRequest, textStatus) {
// Do something here.
}
});
}
});

您可以看看这个小提琴。