Dodawanie reguł sprawdzania poprawności jQuery do dynamicznie tworzonych elementów w ASP

Question

Mam niektóre dynamicznie wstawiane pola formularza na stronie w projekcie MVC3. Zwykle dodamy stronę serwera sprawdzania poprawności jQuery, ale w tym przypadku nie możemy (wiele pól w interfejsie użytkownika generuje wartość dla jednego ukrytego pola - i to jest to, co zostało przesłane.) Nie możemy potwierdzić w odniesieniu do ukrytego pola, więc musimy zamiast dodać walidację UI tylko dla pól użytkownik może widzieć)

gdy pola są dynamicznie dodawane do strony, ja uruchomić poniższy kod na pojemniku:

$container.find(".date").rules("add", { 
    required: true, 
    messages: { 
     required: "The date is required" 
    } 
}); 

Ale to nie robi nie działa! Co dziwne, wyłączenie powyższego kodu, tworzenie elementów dynamicznych, a następnie uruchomienie kodu w konsoli JS przeglądarki działa, ale pokazuje tylko domyślny komunikat sprawdzania poprawności.

Brakuje mi. Jakieś pomysły?

używam jQuery Validation 1.9.0 & plugin dyskretny

Answer 1

Teraz rozumiem, co się dzieje z dyskretny stronie wtyczki rzeczy (co Rozumiem, że jest jakoś powiązany z ASP.NET. Oto, co musisz zrobić:

Po dodaniu nowego elementu zadzwoń pod numer $.validator.unobtrusive.parseElement(newElement), a zostanie on dodany do formularza. Zgodnie z sugerowaną odpowiedzią, musisz ustawić atrybuty data-val i val-data-wymagane w nowym elemencie formularza.

więc skończyć z tym:

//create new form element 
$('form fieldset').append('<br>New Field: '+ 
    '<input type="text" data-val="true" data-val-required="A date is required." name="newField">'+ 
    ' * Also required'); 

//add new rules to it 
$.validator.unobtrusive 
    .parseElement($('form').find('input[name="newField"]').get(0)); 

Pokazany tutaj: http://jsfiddle.net/ryleyb/LNjtd/2/

Answer 2

Jak się okazuje, można to zrobić głównie w HTML, dodając kilka atrybutów dla każdego elementu formularza:

• name przypisują
• data-val="true"
• data-val-required="message"

tak:

<input type='text' name="date" data-val="true" data-val-required="A date is required." /> 

Następnie forma po prostu musi być ponownie przeanalizowany przez JS:

//Remove current form validation information 
$("form") 
    .removeData("validator") 
    .removeData("unobtrusiveValidation"); 

//Parse the form again 
$.validator 
    .unobtrusive 
    .parse("form"); 

Answer 3

Chyba coś bardziej prostego złego - jak twój find('.date') nie został faktycznie znalezienie byle co. W przeciwnym razie twój kod wydaje mi się całkiem rozsądny. Oto przykład, że działa zgodnie z oczekiwaniami: http://jsfiddle.net/ryleyb/LNjtd/

byłem w stanie sprawdzić kod poprawnie z tym:

$('form fieldset') 
    .append('<br>New Field: <input type="text" name="newField"> * Also required') 
    .find('input[name="newField"]').rules('add', { 
     required: true, 
     messages: { 
     required: 'New field is required' 
     } 
    } 
);​