MVC JQuery加載速度太快

Question

我正在使用MVC3和實體框架。我在頁面上有一個帶有複選框的列表供用戶選擇多個項目。 （目標是一次「重新分配」倍數）。

當用戶點擊「重新分配」按鈕時，它會調用一個JQuery對話框出現並加載部分視圖。在部分視圖中，我選擇了複選框的隱藏字段。

一個例子是：

<input type="hidden" value="2,4,5" class="tasks" name="tasks" /> 

但是，我的代碼運行速度太快了jQuery搶被檢查其複選框。當我在Firebug中查看對話框HTML時，該值爲空。

我已經做了測試我的代碼：

var checkeditems = $('input:checkbox[name="selectedObjects"]:checked').map(function() { return $(this).val() }).get().join(","); 
    alert(checkeditems); 
    $('input.tasks').val(checkeditems); 

古怪，值被放到隱藏字段。沒有戒備，他們不在那裏。

這裏是我的javascript：

$('#ReAssign').bind('click', function (event, ui) { 
    GetReassign(); 
    return false; 
}); 

function GetReassign() { 
    $("#ReassignDialog").dialog({ 
     height: 315, 
     width: 525, 
     modal: true, 
     draggable: false, 
     resizable: false, 
     open: function (event, ui) { 
      $(this).load('/InterviewFollowup/ReassignPartial'); 
     }, 
     buttons: { 
      Ok: function() { 
       $(this).dialog("close"); 
      } 
     } 
    }); 

    var checkeditems = $('input:checkbox[name="selectedObjects"]:checked').map(function() { return $(this).val() }).get().join(","); 
    $('input.tasks').val(checkeditems); 
} 

這是我的觀點：

@using (Html.BeginForm("ReassignPost","InterviewFollowup")) { 
<fieldset> 
    <legend><strong>Re-Assign Task</strong></legend> 

    <input type="hidden" value="" id="tasks" class="tasks" name="tasks" /> 

    <div class="editor-label"> 
     Location: 
    </div> 
    <div class="editor-field"> 
     @Html.DropDownList("MailCodes", (SelectList)ViewBag.MailCodes,"-- Select --") 
     @Html.ValidationMessage("MailCodes") 
    </div> 

    <br /> 

    <div class="editor-label"> 
     @Html.LabelFor(model => model.AssignedTo) 
    </div> 
    <div class="editor-field"> 
     <select name="AssignedTo" id="AssignedTo"></select> 
    </div> 

    <div class="editor-label"> 
     Notes: 
    </div> 
    <div class="editor-field"> 
     <input type="text" name="Notes" id="Notes" /> 
     @Html.ValidationMessage("Notes") 
    </div> 

    <p> 
     <input type="submit" value="Submit" /> 
     <input type="button" value="Cancel" /> 
    </p> 

</fieldset> 
} 

Answer 1

的​​jQuery函數是異步的（這是一個AJAX調用），所以這段代碼：部分觀點已被加載之前

var checkeditems = $('input:checkbox[name="selectedObjects"]:checked').map(function() { return $(this).val() }).get().join(","); 
$('input.tasks').val(checkeditems); 

運行，因此你$('input.tasks')選擇不匹配元素 - 添加警報會修復此問題，因爲它會延遲下一行的執行，直到之後的AJAX調用完成。你要的代碼移動到一個回調函數，當​​已完成，像這樣：

$(this).load('/InterviewFollowup/ReassignPartial', function() { 
    var checkeditems = $('input:checkbox[name="selectedObjects"]:checked').map(function() { return $(this).val() }).get().join(","); 
    $('input.tasks').val(checkeditems); 
}); 

Answer 2

我猜你是訪問某些DOM元素它完成加載之前。我想包你的代碼 在文件準備

$(function(){ 

    $('#ReAssign').bind('click', function (event, ui) { 
     GetReassign(); 
     return false; 
    }); 

}); 

http://api.jquery.com/ready/

http://docs.jquery.com/Tutorials:Introducing_$(document).ready()

從上面的頁面，

這是瞭解jQuery的第一件事：如果你想要一個事件到 工作在你的頁面上，你應該稱之爲我在$（document）.ready（） 函數中。一旦DOM被加載，內容中的所有內容都會加載 ，並且在加載頁面內容之前。