ASP.NET MVC 3 与 Razor DropDownListFor 更改未触发
我在这里看到了很多关于 DropDownList 和 DropDownListFor 事件未触发的问题,但没有解决我的问题的答案。我不认为我忽略了任何事情,所以我将发布我自己的问题...
我的视图中有以下代码:
@model MyWebApp.ViewModels.ProductAdminViewModel
@{
ViewBag.Title = "Manage Products";
}
<script type="text/javascript">
$(function () {
$('select#CurrentCategoryId').change(function () {
alert('We got here!');
})
});
</script>
@using (Ajax.BeginForm(new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "indexGrid" }))
{
<fieldset>
<legend>Select Category</legend><span>Category: </span>
@Html.DropDownListFor(model => model.CurrentCategoryId, Model.CategorySelectList, new { @id = "CurrentCategoryId" })
</fieldset>
}
<div id="indexGrid">
@Html.Partial("_indexGrid", Model)
</div>
下拉列表是从我的 ViewModel 中的 SelectList 正确填充的,唯一需要注意的是是VM中的CurrentCategoryId是一个公共int属性。
在将下拉菜单与脚本绑定时我忽略了什么?
编辑:我的 _Layout.cshtml 文件中有以下内容:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="/Scripts/prototype.js"></script>
<script type="text/javascript" src="/Scripts/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="/Scripts/lightbox.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script type="text/javascript" src="/Scripts/EditorTypes.js"></script>
感谢@Hawkke。这是我的工作代码:
<script type="text/javascript">
function CategoryChanged(newCategoryId) {
alert('The category has been changed!');
};
</script>
...
@Html.DropDownListFor(model => model.CurrentCategoryId, Model.CategorySelectList, new { @onchange = "CategoryChanged(" + @Model.CurrentCategoryId + ")" })
I've seen a lot of questions on here regarding DropDownList and DropDownListFor events not firing but no answers that solve my problem. I don't think I've overlooked anything so I'll post my own question...
I have the following code in my View:
@model MyWebApp.ViewModels.ProductAdminViewModel
@{
ViewBag.Title = "Manage Products";
}
<script type="text/javascript">
$(function () {
$('select#CurrentCategoryId').change(function () {
alert('We got here!');
})
});
</script>
@using (Ajax.BeginForm(new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "indexGrid" }))
{
<fieldset>
<legend>Select Category</legend><span>Category: </span>
@Html.DropDownListFor(model => model.CurrentCategoryId, Model.CategorySelectList, new { @id = "CurrentCategoryId" })
</fieldset>
}
<div id="indexGrid">
@Html.Partial("_indexGrid", Model)
</div>
The drop-down is populated correctly from the SelectList in my ViewModel and the only other thing to note is that the CurrentCategoryId in the VM is a public int property.
What have I overlooked in tying the drop-down to the script?
EDIT: I have the following in my _Layout.cshtml file:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="/Scripts/prototype.js"></script>
<script type="text/javascript" src="/Scripts/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="/Scripts/lightbox.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script type="text/javascript" src="/Scripts/EditorTypes.js"></script>
Thanks to @Hawkke. This is my working code:
<script type="text/javascript">
function CategoryChanged(newCategoryId) {
alert('The category has been changed!');
};
</script>
...
@Html.DropDownListFor(model => model.CurrentCategoryId, Model.CategorySelectList, new { @onchange = "CategoryChanged(" + @Model.CurrentCategoryId + ")" })
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
'select#CurrentCategoryId'
需要一个名为“CurrentCategoryId”的控件,但下拉列表的名称是虚拟机的 ID。编辑
我要做的就是将 javascript 从 jQuery 函数更改为常规函数。
然后更改您的 html 帮助程序:
我不是 100% 熟悉 razor 语法,但我认为您明白了。
'select#CurrentCategoryId'
is expecting a control named 'CurrentCategoryId', but the name of your dropdown list is the VM's id.Edit
What I would do is change your javascript from a jQuery function to a regular function.
Then change your html helper:
I'm not 100% on the razor syntax but I think you get the idea.