Prześlij formularz HTML5 za pomocą Javascript i sprawdź jego wejścia

Piszę formularz i dodając atrybuty sprawdzania html5 do jego danych wejściowych, takich jak "wymagany", "autofokus". Używam JavaScript, aby przesłać formularz za pomocą document.myForm.submit(), ale nie sprawdza on poprawności formularza przed atrybutami walidacji html5, ponieważ ich tam nie ma.Prześlij formularz HTML5 za pomocą Javascript i sprawdź jego wejścia

Wszelkie sugestie?

Źródło

2011-07-28 Ahmed Elmorsy

Wygląda na to, że wyzwolenie przycisku click na przycisku przesyłania ma prawidłowy efekt: http://jsfiddle.net/e6Hf7/.

document.myForm.submitButton.click();

aw przypadku, gdy nie ma przycisk Prześlij, dodać jeden niewidzialny jak:

<input type="submit" style="display:none" name="submitButton">

Źródło

2011-07-28 08:44:52 pimvdb

To nie działa! –

@Ahmed Elmorsy: Robi to dla mnie w Chrome. Czy skrzypce zawodzą dla ciebie? – pimvdb

Pracuję również nad Chrome. właściwość submitButton jest niezdefiniowana. –

Dlaczego nie wystarczy zadzwonić walidacja ręcznie przed wykonaniem document.myForm.submit()

Co walidacji ramy używacie i co AJAX biblioteki?

W przypadku korzystania z jQuery Oto kod, aby zapobiec złożyć:

$('#myForm').submit(function(evt) { 
    if (! $('#myForm').validate()) { 
    evt.preventDefault(); 
    } 
});

i wyzwalają złożyć poprzez:

$('#myForm').submit();

byłoby to nazwać walidacja gdy przedstawienia jest wyzwalany .. I jeśli sprawdzanie poprawności nie powiedzie się, uniemożliwia wykonanie przesyłania. Ale chciałbym spojrzeć na validationframework jak to zazwyczaj powinien to zrobić już

W przypadku, gdy nie używają żadnych ram JavaScript może warto spojrzeć na: element.checkValidity(); i jak wywołać walidacji HTML5 z JavaScript przed nawet dzwonisz, by przesłać.

Źródło

2011-07-28 08:43:47 Tigraine

"Struktura" to zwykły HTML5 i chce wywołać wbudowaną funkcję sprawdzania poprawności. – Xion

Dzięki .. Nie wiedziałem, że rzeczy sprawdzania poprawności są już zaimplementowane w przeglądarkach. Zaktualizowałem odpowiedź wskaźnikiem na MDN – Tigraine

Tak, jak powiedział Xion. To zwykły HTML5, czy ktoś wie, jak mogę użyć jego wbudowanej funkcji sprawdzania poprawności? ? –

Odpowiedź pimvdb bazuje na obejście zawierać ukryty złożyć przycisk.

HTML5 udostępnia funkcje javascript umożliwiające osiągnięcie tego samego bez przycisku przesyłania. Jak Tigraine wskazał, Mozilla dokumenty dwie metody sprawdzania ważności dla elementów 'form':

checkValidity() return true/false i nie pokazuje niczego do użytkownika końcowego
reportValidity() return true/false a także pokazuje komunikaty walidacji dla użytkownika końcowego (jak normalny złożyć kliknij przycisk robi)

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 
<form name="testform" action="action_page.php"> 
 
E-mail: <input type="email" name="email" required><br/> 
 
<a href="#" onclick="javascript:console.log(document.testform.reportValidity());return false;">Report validity</a><br/> 
 
<a href="#" onclick="javascript:console.log(document.testform.checkValidity());return false;">Check validity</a><br/> 
 
<a href="#" onclick="javascript:if(document.testform.reportValidity()){document.testform.submit();}return false;">Submit</a> 
 
</form> 
 

 
</body> 
 
</html>

Źródło

2015-05-08 12:57:05 zutnop

Prześlij formularz HTML5 za pomocą Javascript i sprawdź jego wejścia

Odpowiedz

Powiązane problemy