La convalida non invadente non funziona sulla vista parziale aggiunta dinamicamente

Question

Attualmente sto affrontando un problema con la convalida dopo l'aggiunta dinamica del contenuto.

Ho una vista fortemente digitato su un modello (Order). Questo ordine può avere molti articoli. Il modello è simile al seguente:

public class Order 
{ 
    [Key] 
    [HiddenInput] 
    public int id { get; set; } 

    [Display(Name = "Order Number")] 
    public string number { get; set; } 

    [Display(Name = "Order Date")] 
    [DataType(DataType.Date)] 
    [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:MM/dd/yyyy}")] 
    public DateTime date { get; set; } 

    [Required(ErrorMessage = "Beneficiary is required.")] 
    [Display(Name = "Beneficiary")] 
    public int beneficiary_id { get; set; } 

    [Display(Name = "Beneficiary")] 
    public Beneficiary beneficiary { get; set; } 

    [Display(Name = "Items")] 
    public List<Item> items { get; set; } 

    [Display(Name = "Payment Method")] 
    public List<PaymentMethod> payment_methods { get; set; } 
} 

Inserisco le informazioni dell'ordine e anche le voci per quello specifico ordine. Ho provato un paio di modi per aggiungere contenuti dinamicamente e alla fine sono andato con Steven Sanderson's way.

A mio avviso, non ho le informazioni di regolare ordine e poi le voci, in cui il mio modello simile a questa:

@model trackmeMvc.Models.Model.Order 
@{ 
    ViewBag.Title = "Create"; 
    Html.EnableClientValidation(); 
    Html.EnableUnobtrusiveJavaScript(); 
} 

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 

<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/MicrosoftMvcValidation.js")" type="text/javascript"></script> 

@using (Html.BeginForm("Create", "Order", FormMethod.Post, new { @id = "create_order" })) 
    { 
    @Html.ValidationSummary(true, "Order creation was unsuccessful. Please correct the errors and try again.") 

    <div class="editor-label"> 
     @Html.LabelFor(m => m.date)<req>*</req> 
    </div> 
    <div class="editor-field"> 
     @Html.TextBoxFor(m => m.date, new { @id = "order_date" })<br /> 
     @Html.ValidationMessageFor(m => m.date) 
    </div> 

...

<script type="text/javascript"> 

    $(document).ready(function() { 

     $("#addItem").click(function() { 

      var formData = $("#main_div").closest("form").serializeArray(); 

      $.ajax({ 
       url: "/IPO/BlankItemRow", 
       type: "POST", 
       //data: formData, 
       cache: false, 
       success: function (html) { 
        $("#editorRows").append(html); 
         //$.validator.uobtrusive.parseDynamicContent("form *"); 
         //$("#editorRows").removeData("validator"); 
         //$("#editorRows").removeData("unobtrusiveValidation"); 
         //$.validator.unobtrusive.parse("#editorRows"); 
         //$.validator.unobtrusive.parse("#create_ipo"); 
         //$.validator.unobtrusive.parseDynamicContent($(this).first().closest("form")); 
         //$.validator.unobtrusive.parse($("#new_ipo_item")); 

         //$.validator.unobtrusive.parseElement($("#editorRows").find(".editRow:last").children().find("select")); 
          //$("#editorRows").find(".editRow:last").find("select").each(function() { 
          //alert($(this).attr("id")); 
          //$.validator.unobtrusive.parseElement($(this)); 
          //$.validator.unobtrusive.parseDynamicContent($(this)); 
          //$.validator.unobtrusive.parseDynamicContent($(this).attr("name")); 
         //}); 
          //$("#editorRows").children().find(".editRows:last").find("*").each(function() { 
          // alert($(this).attr('id')); 

          //$.validator.unobtrusive.parseDynamicContent('input'); 
         //}); 
         //var form = $(this).closest("form").attr("id"); 
         //$(form).removeData("validator"); 
         //$(form).removeData("unobtrusiveValidation"); 
         //$.validator.unobtrusive.parse(form); 
        } 
       }); 
      return false; 
     }); 
    }); 

</script> 

Queste sono alcune delle cose Ho provato, e niente funziona.

Ho ricevuto il parseDynamicContent da Applying unobtrusive jquery validation to dynamic content in ASP.Net MVC. L'ho provato in ogni scenario a cui potessi pensare, ma ancora senza fortuna.

Ho anche provato il parse regolare, eliminando la convalida dalla forma applicando poi di nuovo, ma ancora gli elementi appena aggiunti non vengono convalidati:

<div id="editorRows"> 
    @foreach (var item in Model.items) 
    { 
     @Html.Partial("_NewItem", item) 
    } 
</div> 

... e la mia vista parziale sarebbe simile a questa :

@model trackmeMvc.Models.Model.Item 

@{ 
    Layout = "";  
    Html.EnableClientValidation(true); 

    if (this.ViewContext.FormContext == null) 
    { 
     this.ViewContext.FormContext = new FormContext(); 
    } 
} 

<div class="editRow"> 

@using (Html.BeginCollectionItem("order_items")) 
{ 

    @Html.DropDownListFor(m => m.item_id, @items, "None", new { @style = "width:205px;", @id = "ddlItems", @class="ddlItem", @name="ddlItemList" }) 
    @Html.ValidationMessageFor(m => m.item_id) 

    ... 

} 

</div> 

Quindi, quello che sta succedendo è che ho una voce vuota inviato dal controller alla vista di default, per mostrare una riga vuota. L'elemento è convalidato, ma qualunque cosa succeda dopo aver fatto clic su aggiungi elemento, viene visualizzata un'altra riga, da quella parziale, ma non riesco a farla convalidare. Ho provato a mettere la convalida nella vista parziale, (prima che il documento fosse pronto nella forma principale), e tutto ciò che ho letto ho applicato, e finisce sempre nello stesso modo: convalidare la prima riga, e non le altre. Ho provato la validazione di Steven Sanderson fatto a tal fine - ancora senza fortuna - anche la convalida per i partial, trovato at this link e la pagina che segue, che è specifico per la convalida parziale ...

Cosa devo fare per ottenere questo validazione funzionante?

Answer 1

Ok, ho intenzione di ricominciare con una nuova risposta qui.

Prima di chiamare $.validator.unobtrusive.parse, rimuovere il validatore originale e convalida discreto dalla forma in questo modo:

var form = $("#main_div").closest("form"); 
form.removeData('validator'); 
form.removeData('unobtrusiveValidation'); 
$.validator.unobtrusive.parse(form); 

Questa stessa risposta è documentato here.