MVC3部分视图模式对话框被调用两次

我添加一个jQuery组件到我的模态对话框时遇到了一个有趣的问题。 jQuery的UI元素（简单的颜色插件，在http://recursive-design.com/projects/jquery-simple-color/找到）被渲染两次！经过调查，我发现模态对话框（这是部分视图）本身正在呈现两次。下面是我的主视图相关代码：MVC3部分视图模式对话框被调用两次

// Here is the jQuery: 
@section Head 
{ 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#addUserDialog").dialog({ modal: true, autoOpen: false, buttons: [ 
      { 
       text: "Submit", 
       click: function() { 
        $("#addUserForm").submit(); 
       } 
      }, 
      { 
       text: "Cancel", 
       click: function() { 
        $(this).dialog("close"); 
       } 
      }] 
     }); 

     $('#addUser').click(function() { 
      $("#addUserDialog").dialog("open"); 
     }); 
    </script> 
} 

// And here is the rendering of the partial view: 
<div id="addUserDialog" title="Add User" style="display:none"> 
    @Html.Partial("AddUserView", ViewData["user"]) 
</div>

局部视图模式对话框是在这里：

@model UserModel 
<script type="text/javascript"> 
    $(function() { 
     alert("addUser"); 
     $.validator.unobtrusive.parse("#addUserForm"); 
     $(".colorPicker").simpleColor(); 
    }); 

    var closeAddUserDialog = function() { 
     $("#addUserDialog").dialog("close"); 
    }; 
</script> 

@using (@Ajax.BeginForm("addUser", 
         "OnCallControl", 
         new AjaxOptions 
         { 
          HttpMethod = "Post", 
          InsertionMode = InsertionMode.Replace, 
          UpdateTargetId = "userTable", 
          OnSuccess = "closeAddUserDialog" 
         }, 
         new { id = "addUserForm" })) 
{ 
    ... // Other form inputs 
    <input class="colorPicker" value="#cc3333" /> 
}

警报语句提出了两次页面的初始开启。有趣的现象：我有另一种模式对话框，它具有相同的格式，并具有类似的警报语句（例如alert("editUser");），并且两个警报语句按顺序出现两次（addUser，editUser，addUser，editUser）。

我怀疑我的方法在头部和局部视图内部都使用jQuery是不好的，但我不知道这是什么导致局部内部的jQuery函数被执行两次。有没有人有任何想法，为什么发生这种情况？如果我的怀疑是正确的，我该如何纠正这种情况？

附加信息：

我确信，这个问题在索引视图或局部对话框意见的地方来了，因为情态动词不是从其他地方呼吁视图的初始GET请求。

当我将对话声明移至click事件功能（替换dialog("open")命令，并且删除了autoOpen: false选项）时，该警报仅在初始GET的对话框中发生过一次。重复的jQuery colorPicker小部件仍然在那里。

来源

2012-07-26 c0nn

这是一件事情...每次JQuery对话框都用.dialog（）进行初始化时，即将变成对话框的DIV被撕掉DOM，并且被复制或移动（不记得哪个）到确保它不在任何其他子DIV下面。所以，让我问你这个问题......你有多个地方渲染你的标题部分？ – Shenaniganz 2012-07-26 17:07:38

@Shenaniganz不，只是一个。 – c0nn 2012-07-26 17:20:04

无论如何，你的renderSection在哪里？ – Shenaniganz 2012-07-26 17:59:03

我在对@Html.RenderPartial()命令如何运行有一个根本的误解。我不知道如何从主视图访问局部视图的元素。代替从部分视图实例化颜色选择器，我能够成功初始化颜色选择器，如果它完成后部分视图变成标记。这确保了只有一个颜色选择器被放置在对话框中。

该解决方案规避了部分视图运行javascript两次的问题。我假设MVC（在这种情况下）总是贯穿部分两次，一次是初始标记，一次是实际创建对话。我想知道是否有方法指示Visual Studio 而不是运行通过局部视图，直到我告诉它？

来源

2012-07-27 13:16:21 c0nn

执行此操作的方法不是预加载“部分视图”对话框。你可以在你的主视图上有一个空的div，然后调用JQuery $（'＃divName'）。load（'PartialView Path here'）在你需要显示它时按需加载你的局部视图。 – Shenaniganz 2012-07-31 16:47:53

MVC3部分视图模式对话框被调用两次

回答

相关问题