jquery sprawdź poprawność pozycji

Question

Próbuję użyć sprawdzania poprawności jquery. Podążając za przykładem: http://docs.jquery.com/Plugins/Validation działa świetnie i chciałbym powielić go za pomocą mojego kodu. Jednak nie jestem pewien, jak to nazwać.

To, co mam, to wygenerowana tablica html, a po kliknięciu przycisku "Edytuj" dla dowolnego wiersza otwiera formularz. Chcę sprawdzić poprawność tego formularza za pomocą jquery. Wierzę, że to działa, ale kiedy trafiam przesłać na formularzu, ukrywam formularz, więc nigdy nie zobaczę działania zatwierdzającego ... Myślę.

wygenerować formularz z javascript i przycisk submit wygląda następująco:

var mysubmit = document.createElement("input"); 
mysubmit.type = "submit"; 
mysubmit.name = "Submit"; 
mysubmit.value = "Apply" 
mysubmit.onclick = function() { 
    //return formSubmitactivecameras(); 
js("#EditCameraForm").validate(); 
    this.form.submit(); 
}; 
myform.appendChild(mysubmit); 

To ledwie wystarczająco dużo informacji, więc mam cały kod w tym skrzypce: http://jsfiddle.net/UtNaa/36/. Jednak nie wydaje mi się, aby skrzypce zadziałały po kliknięciu przycisku Edytuj. Co otwiera formularz, w którym chcę walidację.

Nie jestem pewien, czy proces sprawdzania poprawności działa. Może tak jest, ale kiedy klikniesz przycisk "Prześlij" na formularzu, formularz się ukryje. Znowu skrzypce nie działa, aby pokazać formę, ale działa dla mnie na mojej stronie. Mam nadzieję, że kod w nim przynajmniej pomoże.

Answer 1

zasadzie trzeba dodać sprawdzanie każdego elementu albo nazwać dodając

myinput.className = "required"; // add this line 

następnie dołączyć wszystkie elementy pierwszy PRZED złożeniem wniosku sprawdź poprawność

lub dodaj regułę

js("#EditCameraForm").validate(); 
     rules: { 
      camera_name: { 
       required: true, 
       minlength: 50, 
       maxlength: 10 
      }, 
}; 

w tym przykładzie będzie to wymagać wejście max 50 odbarwiającego i min 10

można również dodać własne walidacji stosując addMethod Aby można było potwierdzić

$.validator.addMethod("alphanum", function(value, element) { 
    return this.optional(element) || /^[a-z0-9]+$/i.test(value); 
}, "This field must contain only letters and numbers."); 

js("#EditCameraForm").validate(); 
     rules: { 
      camera_name: { 
       required: true, 
       alphanum: true, 
       minlength: 50, 
       maxlength: 10 
      }, 
}; 

wtedy, gdy forma zostanie przesłany po naciśnięciu przycisku przesyłania, ale nie umieszczaj w nim ukrytej części, tylko włóż podpaskę do zgłaszania poprawek

js("#EditCameraForm").validate(); 
    rules: { 
     camera_name: { 
      required: true, 
      minlength: 50, 
      maxlength: 10 
     } 
    }, 
    submitHandler: function() { 
     // do stuff once form is valid but before it is sent 
    } 
}; 

Oto przykład jak zastosować niestandardowe komunikaty, byłoby to w po zasad

messages: { 
    email: { 
     required: 'Enter this!' 
    } 
} 

l

Answer 2

Problem polega na tym, że formularz nie wie, jakie pola formularza mają zawierać.

Zamów ponownie dokument i przykłady. Najwyraźniej możesz użyć nazw klas i atrybutów niestandardowych do skonfigurowania walidatora. Możesz też użyć funkcji $ .rule(), aby dodać reguły do ​​formularza.

Na przykład utwórz nazwę pola kamery, dodając do wpisu nazwy "wymaganą" klasę.

var myinput = document.createElement("input"); 
myinput.name="camera_name"; 
myinput.value=cameraname; 
myinput.id="CameraName"; 
myinput.className = "required"; // add this line 
myform.appendChild(myinput); 

także zmodyfikować przycisk Prześlij onClick obsługi

//submit changes button 
var mysubmit = document.createElement("input"); 
mysubmit.type = "submit"; 
mysubmit.name = "Submit"; 
mysubmit.value = "Apply" 
mysubmit.onclick = function() { 
    //return formSubmitactivecameras(); 
    js("#EditCameraForm").validate() 
    //this.form.submit(); // This isn't needed, the form will be submitted when this function ends 
}; 
myform.appendChild(mysubmit); 

Answer 3

Trzeba zmienić ramy na lewej stronie w jsFiddle „no oblewania (głowy) "i twój JavaScript zacznie działać. Oto zmienione skrzypce. http://jsfiddle.net/UtNaa/39/

Twój kod nie działa, ponieważ brakuje elementów w kodzie HTML. Prawdopodobnie po dodaniu pozostałych części kodu może zacząć działać, jeśli nie, będzie łatwiej debugować.

Answer 4

Nie sprawdziłem części sprawdzania poprawności, ponieważ jest ona już udzielona. Ale naprawdę możesz użyć drobnego oczyszczenia w swoim kodzie.

Zamówienie to przepisany podejście: http://jsfiddle.net/UtNaa/40/

---

Naprawiono błąd z wydarzeń przycisku: http://jsfiddle.net/UtNaa/42/