ASP.NET MVC 2使用jQuery加載部分視圖 - 無客戶端驗證

Question

我使用jQuery.load()來渲染局部視圖。這部分看起來是這樣的：

$('#sizeAddHolder').load(
       '/MyController/MyAction', function() { ... }); 

在我的控制器操作的代碼如下：

public ActionResult MyAction(byte id) 
    { 
     var model = new MyModel 
     { 
      ObjectProp1 = "Some text" 
     }; 

     return View(model); 
    } 

    [HttpPost] 
    public ActionResult MyAction(byte id, FormCollection form) 
    { 
     // TODO: DB insert logic goes here 

     var result = ...; 

     return Json(result); 
    } 

我回來，看起來像這樣的局部視圖：

<% using (Html.BeginForm("MyAction", "MyController")) {%> 
    <%= Html.ValidationSummary(true) %> 

    <h3>Create my object</h3> 

    <fieldset> 
     <legend>Fields</legend> 

     <div class="editor-label"> 
      <%= Html.LabelFor(model => model.ObjectProp1) %> 
     </div> 
     <div class="editor-field"> 
      <%= Html.TextBoxFor(model => model.Size.ObjectProp1) %> 
      <%= Html.ValidationMessageFor(model => model.ObjectProp1) %> 
     </div> 

     div class="editor-label"> 
      <%= Html.LabelFor(model => model.ObjectProp2) %> 
     </div> 
     <div class="editor-field"> 
      <%= Html.TextBoxFor(model => model.ObjectProp2) %> 
      <%= Html.ValidationMessageFor(model => model.ObjectProp2) %> 
     </div> 

     <p> 
      <input type="submit" value="Create" /> 
     </p> 
    </fieldset> 

<% } %> 

在這種情況下，客戶端驗證不起作用。包含驗證消息的腳本還包含在返回的視圖中。我的模型類中的兩個屬性都具有Required和StringLength屬性。 有沒有什麼辦法來觸發客戶端驗證的視圖中已經這樣加載？

Answer 1

這是適用的：asp-net-mvc-client-side-validation-with-dynamic-contents

Answer 2

首先你應該返回一個局部視圖而不是視圖。

return PartialView(model); 

其次，你是否試圖用AJAX加載這個局部視圖？在這種情況下，你可能想使用jquery.ajax

function ajax_update(path) 
    $.ajax { 
    url: path, 
    success: function(result) { 
     $('#sizeAddHolder').html(result); 
    } 
    return false; 
} 

Answer 3

您應該Ajax調用

function ajax_update(path) 
    $.ajax { 
    url: path, 
    dataType: "html", 
    success: function(result) { 
     $('#sizeAddHolder').html(result); 
    } 
    return false; 
} 

從jQuery docs使用數據類型：

的dataType 默認：智能猜測（XML，JSON，腳本，或html）

您希望從服務器返回的數據類型。如果沒有指定，jQuery將根據響應的MIME類型智能地嘗試獲取結果（XML MIME類型將生成XML，在1.4 JSON中將生成一個JavaScript對象，在1.4腳本中將執行該腳本）否則將作爲字符串返回）。可用的類型（以及作爲第一個參數，以您的成功回調傳遞的結果）是：

* "xml": Returns a XML document that can be processed via jQuery. 
* "html": Returns HTML as plain text; included script tags are evaluated when inserted in the DOM. 
* "script": Evaluates the response as JavaScript and returns it as plain text. Disables caching unless option "cache" is used. Note: This will turn POSTs into GETs for remote-domain requests. 
* "json": Evaluates the response as JSON and returns a JavaScript object. In jQuery 1.4 the JSON data is parsed in a strict manner; any malformed JSON is rejected and a parse error is thrown. (See json.org for more information on proper JSON formatting.) 
* "jsonp": Loads in a JSON block using JSONP. Will add an extra "?callback=?" to the end of your URL to specify the callback. 
* "text": A plain text string. 

Answer 4

我不知道如果你還在尋找熱塑成型的回答你的問題，但我寫一篇關於製作後在ASP.NET MVC 2中使用AJAX加載的表單與客戶端驗證一起工作： http://tpeczek.com/2010/04/making-aspnet-mvc-2-client-side.html

Answer 5

問題是，使用ajax加載的表單永遠不會使用Microsoft驗證進行註冊。要解決它，請調用以下函數Sys.Mvc.FormContext._Application_Load。

function ajax_update(path) 
    $.ajax { 
    url: path, 
    success: function(result) { 
     $('#sizeAddHolder').html(result); 
     Sys.Mvc.FormContext._Application_Load(); 
    } 
    return false; 
} 

這應該解決它。另外，確保通過ajax加載的表單具有唯一的ID。否則，驗證將失敗。

避免使用load（）。它刪除在響應中加載的所有腳本。

Answer 6

在你可以像HTML文件：

我們對此深感抱歉，但我不無如何張貼一個鏈接的HTML。所以你可以有一個鏈接類 =「刪除」，ID = 值和一個href =「javascript :;」

然後我用這個功能來呈現局部視圖：

$(".delete").click(function(event){ 
      var id = $(".select").attr("id"); 
      var id2 = event.target.id; 
      $.ajax({ 
       url: "Persona/Delete?idPersona=" + id2.toString(), 
       success: function (data) { 
        $("#popUpConfirmar").html(data); 
       } 
      }); 

      dialogoPopUp.dialog("open"); 
     }); 

記得在CONTROLER你必須像一個動作：

public PartialViewResult Delete(int idPersona) 
    { 
     PersonaDataAccess personaDataAccess = new PersonaDataAccess(); 
     Persona persona = personaDataAccess.GetOne(idPersona); 
     return PartialView("Delete",persona); 
    }