dinamik içerikle çalışmayan göze çarpmayan doğrulama

AJAX çağrısı aracılığıyla dinamik olarak yüklenen kısmi bir görünümle çalışmak için göze çarpmayan jquery doğrulamasını almaya çalışırken sorunlar yaşıyorum.

Şansım olmadan bu kodu çalıştırmak için günler harcıyorum.

İşte Görünüm:

@model MvcApplication2.Models.test

@using (Html.BeginForm())
{
 @Html.ValidationSummary(true);
 <div id="res"></div>
 <input id="submit" type="submit" value="submit" />
}

Kısmi Görünüm:

@model MvcApplication2.Models.test

@Html.TextAreaFor(m => m.MyProperty);
@Html.ValidationMessageFor(m => m.MyProperty);

<script type="text/javascript" >
  $.validator.unobtrusive.parse(document);
</script>

Model:

  public class test
  {
    [Required(ErrorMessage= "required field")]
    public int MyProperty { get; set; }
  }

Kontrol eden, denetleyici:

    public ActionResult GetView()
    {
        return PartialView("Test");
    }

ve son olarak, javascript:

$(doument).ready(function () {
$.ajax({
    url: '/test/getview',
    success: function (res) {

        $("#res").html(res);
        $.validator.unobtrusive.parse($("#res"));
    }
});

$("#submit").click(function () {
    if ($("form").valid()) {
        alert('valid');
        return true;
    } else {
        alert('not valid');
        return false;
    }
});

Doğrulama çalışmıyor. Metin kutusuna herhangi bir bilgi girmesem bile, gönderme olayı uyarıyı ('geçerli') gösteriyor.

Ancak, görünümü dinamik olarak yüklemek yerine @Html.Partial("test", Model), kısmi Görünümü ana Görünümde işlemek için kullanıyorsam (ve AJAX çağrısını yapmıyorum), o zaman doğrulama gayet iyi çalışıyor.

Bunun nedeni muhtemelen içeriği dinamik olarak yüklersem, kontrollerin henüz DOM'da mevcut olmamasıdır. Ama $.validator.unobtrusive.parse($("#res")); onaylayıcıya yeni yüklenen kontroller hakkında izin vermek için yeterli olması gereken bir arama yapıyorum ...

Biri yardım edebilir mi ?

Zaten ayrıştırılmış bir formu ayrıştırmaya çalışırsanız, güncellenmez

Forma dinamik öğe eklediğinizde ne yapabilirsiniz?

1. Formun doğrulamasını kaldırabilir ve şu şekilde yeniden doğrulayabilirsiniz:

   var form = $(formSelector)
       .removeData("validator") /* added by the raw jquery.validate plugin */
       .removeData("unobtrusiveValidation");  /* added by the jquery unobtrusive plugin*/
   
   $.validator.unobtrusive.parse(form);
   

2. unobtrusiveValidationJquery datayöntemini kullanarak form verilerine erişin :

   $(form).data('unobtrusiveValidation')
   

   daha sonra kural koleksiyonuna erişin ve yeni öğelerin niteliklerini ekleyin (bu biraz karmaşıktır).

Bir forma dinamik öğeler eklemek için kullanılan bir eklenti için ASP.Net MVC'de göze çarpmayan jquery doğrulamasını dinamik içeriğe uygulama hakkındaki bu makaleye de göz atabilirsiniz . Bu eklenti 2. çözümü kullanır.

Nadeem Khedr'in cevabına ek olarak ...

DOM'nuza dinamik olarak bir form yüklediyseniz ve ardından

jQuery.validator.unobtrusive.parse(form); 

(belirtilen ekstra bitlerle) ve ardından ajax kullanarak bu formu gönderecekler, aramayı unutmayın

$(form).valid()

formunuzu göndermeden önce doğru veya yanlış döndüren (ve gerçek doğrulamayı çalıştıran).

bunu _Layout.cshtml dosyanıza ekleyin

 $(function () {
        //parsing the unobtrusive attributes when we get content via ajax
        $(document).ajaxComplete(function () {
            $.validator.unobtrusive.parse(document);
        });
    });

Şaşırtıcı bir şekilde, bu soruyu incelediğimde, resmi ASP.NET belgeleri, göze çarpmayan parse()yöntem veya dinamik içerikle nasıl kullanılacağı hakkında hala herhangi bir bilgiye sahip değildi . Dokümanlar deposunda (@ Nadeem'in orijinal cevabına atıfta bulunarak) bir sorun yaratma ve düzeltmek için bir çekme talebi gönderme özgürlüğünü aldım . Bu bilgiler artık model doğrulama konusunun istemci tarafı doğrulama bölümünde görülebilir .

bunu test et:

if ($.validator.unobtrusive != undefined) {
    $.validator.unobtrusive.parse("form");
}

Aynı sorundan etkilendim ve bunun dışında hiçbir şey işe yaramadı:

$(document).ready(function () { 
    rebindvalidators();
});

function rebindvalidators() {
    var $form = $("#id-of-form");
    $form.unbind();
    $form.data("validator", null);
    $.validator.unobtrusive.parse($form);
    $form.validate($form.data("unobtrusiveValidation").options);
}

ve Ekle

// Check if the form is valid
var $form = $(this.form);
if (!$form.valid())
    return;

formu kaydetmeye çalıştığınız yer.

Formu Ajax aramasıyla kaydediyordum.

Umarım bu birine yardımcı olur.

sadece bu kodu modsal kodun sonuna kopyalayın

    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

;)