Sprawdzanie poprawności strony jQuery klienta nie działa w częściowym widoku MVC3

Question

Nie mogłem uzyskać funkcji sprawdzania poprawności strony klienta z następującym częściowym widokiem. Ten widok jest w div divetettings div w widoku nadrzędnym. Próbowałem wiele rzeczy od stackoverflow i innych stron, nic nie wydaje się działać. Jakieś pomysły?

<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/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> 


@using (Ajax.BeginForm("CreateT", "TAdmin", null, 
     new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "divTSettings"}, 
         new { id = "CreateTForm" })) 
{ 
    <div> 
     <label>Name:</label> 
     <input type="text" name="tName" id="tName"/> 
     @Html.ValidationMessage("tName") 
     <input type="submit" value="Submit"/> 
    </div> 
} 

<script type="text/javascript"> 
$(function() { 
    $('#CreateTForm').validate({ 
     rules: { 
      tName: { 
       required: true 
      } 
     }, 
     messages: { 
      tName: { 
       required: 'Name required' 
      } 
     } 
    }); 
    $("#CreateTForm").removeData("validator"); 
    $("#CreateTForm").removeData("unobtrusiveValidation"); 
    $.validator.unobtrusive.parse("#CreateTForm"); 
}); 
</script> 

Answer 1

Jakieś pomysły?

Tak, pierwszą rzeczą, którą należy zrobić, to pozbyć się wszystkich tagów <script> z widoku częściowego. Częściowe widoki nie powinny zawierać żadnych skryptów. Częściowe widoki powinny zawierać tylko znaczniki. Powtarzałem to wiele razy i wciąż widzę, jak ludzie umieszczają tam skrypty. Skrypty powinny być zarejestrowane albo w twoim układzie, albo w głównym widoku, w którym renderowałeś częściowe, prawdopodobnie poprzez przesłonięcie niektórych sekcji skryptów zarejestrowanych w twoim układzie, aby wszystkie skrypty zostały wstawione na końcu dokumentu HTML, tuż przed zamykającym tagiem </body> . Tam właśnie należą.

OK, teraz problem polega na tym, że dyskretna walidacja nie działa od razu po dodaniu dynamicznie dodawanych elementów do DOM - na przykład wysłanie żądania AJAX do serwera, który zwraca częściowy widok i ten częściowy widok jest następnie wprowadzany do DOM.

Aby to działało, musisz zarejestrować nowo dodane elementy z dyskretną strukturą sprawdzania poprawności. Aby to zrobić, trzeba zadzwonić do $.validator.unobtrusive.parse na nowo dodanych elementów:

$("form").removeData("validator"); 
$("form").removeData("unobtrusiveValidation"); 
$.validator.unobtrusive.parse("form"); 

Należy umieścić ten kod wewnątrz sukcesu obsługi AJAX, który jest wstrzykiwanie częściowy do swojej DOM. Po wstrzyknięciu nowych elementów po prostu wywołaj tę funkcję.

Jeśli nie piszesz ręcznie żądań AJAX za pomocą jQuery ($ .ajax, $ .post, ...), ale polegasz na tym, że niektórzy pomocnicy Ajax.BeginForm i Ajax.ActionLink wykonują zadanie za Ciebie, trzeba subskrybować wywołania zwrotne OnSuccess w AjaxOptions i umieścić tam ten kod.

Answer 2

Jeśli chcesz naprawić na poziomie globalnym, powinno to pomóc. Użyłem w _layout.cstml.

$(document).ajaxStart(function() { 
       $.ajaxSetup({ 
        converters: { 
         "text html": function (textValue) { 
          if (textValue) { 
           // Some parsing logic here 
           var script = "<script type='text/javascript' language='javascript' > $.validator.unobtrusive.parse(\"form\");"; 
           var scriptend = "\<\/script>"; 
           return script + scriptend + " " + textValue; 
          } else { 
           // This will notify a parsererror for current request 
           throw exceptionObject; 
          } 
         } 
        } 
       }); 
      });