变化事件停止后jQueryUI的弹出窗口打开和关闭
这里的短TL射击; DR版本:变化事件停止后jQueryUI的弹出窗口打开和关闭
我对选择列表中一个onchange事件停止射击
是否有使用JQuery对元素的任何问题id ie $("#Customer_ID").change
,如果该元素位于从部分视图填充的jqueryui弹出框内。继此我有两个不同的弹出窗口由共享同一$("#Customer_ID").change
的JavaScript
我有两个div的jQuery UI的弹出窗口
当我在jqGrid的一个单元格单击页面,我弹出不同的部分景色填充相应的对话框(编辑或新)
的弹出式窗口依次填充由局部视图来自控制器
这工作正常
我有三个级别的级联d的在这些弹出窗口中猛击。大多数时候他们正常工作。几次打开和关闭弹出窗口然而动态下拉停止工作
在这一点上动态下拉jscript正在加载好,但似乎没有改变事件被触发。
我怀疑这是因为我有两个具有相同名称控件的弹出窗口?
反正这里是一些简略的代码片断
_Layout.cshtml
具有对JS参考,重视所有jQueryUI的东西
<!-- Logic to setup edit,new,delete popups -->
<script src="~/Scripts/Layout.js" type="text/javascript"></script>
Layout.js
包含设置编辑弹出窗口的代码和s还有其他的东西。这里只是为创建弹出部分:
$("#dialog-create").dialog({
title: 'New',
autoOpen: false,
resizable: true,
width: 800,
height: 440, // this allows the dialog to correctly estimate the middle of the viewport
show: { effect: 'fade', duration: 100 },
modal: true,
open: function (event, ui) {
if (urlNew) $(this).load(urlNew);
},
});
TasksWeeklyClient.cshtml
这实际上有一个jqGrid的就可以了。点击一个单元格弹出,例如创建弹出窗口。
<!-- edit, new, delete popups -->
<div id="dialog-edit" style="display: none; z-index: 2000;">
</div>
<div id="dialog-create" style="display: none; z-index: 2001;">
</div>
Create.cshtml
这是通过返回一个局部视图的控制器供电。这是问题开始的地方。 Customer_ID下拉级联到CustomerProject_ID下拉列表。几次关闭并打开后,它停止工作。这也有TasksDialogs.js
参考已全部级联下拉的东西(级联下拉是另一个问题,这里的主题:cascading drop downs repeatedly populated
(此代码在任务中查看文件夹)
<div class="form-group">
@Html.LabelFor(model => model.Customer_ID, "Customer & Project", htmlAttributes: new { @class = "control-label col-md-6 text-md-left" })
<div class="col-md-12">
@Html.DropDownList("Customer_ID", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.Customer_ID, "", new { @class = "text-danger" })
</div>
<div class="col-md-12">
@Html.DropDownList("CustomerProject_ID", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.CustomerProject_ID, "", new { @class = "text-danger" })
</div>
TaskDialogs.js
最后,我们有这样的剧本。通常这个工作,但一些弹出后打开和关闭,CustomerID.change不再出现在控制台中。
你可以看到我试过两种不同的方式来附加更改事件。两者都表现出相同的症状。
$(document).ready(function() {
console.log("TasksDialog.js ready");
console.log($("#Customer_ID"));
//When Customer is changed reload Project
// Project function reloads project tasks
$("#Customer_ID").on("change",
// $("#Customer_ID").change(
function() {
console.log("CustomerID.change");
// refresh projects
refreshProjectFromClient();
}
);
我不知道我需要发布控制器代码。这部分工作正常。
在管理动态下拉菜单的JavaScript我用
$("#Customer_ID")
指领域上的两个不同的对话框。
原来我需要而使用这些,专指我想要的领域:
$(div#dialog-create #Customer_ID")
$(div#dialog-edit #Customer_ID")
我觉得可能更改事件没有被正确安装出于同样的原因。现在我通过在cshtml视图中硬编码改变控制来解决这个问题:
@Html.DropDownList("Customer_ID", null,
htmlAttributes:
new {
@class = "form-control",
@onchange= "refreshProjectFromClient()"
})