变化事件停止后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()" 
})