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部分視圖模式對話框被調用兩次

回答

相關問題