RSS
 

Walidacja formularza i blokada przycisku

15 wrz

Poniższy skrypt sprawdza tylko i wyłącznie czy cokolwiek zostało wpisane w danego inputa i jeżeli wszystkie wymagane pola nie zostały wypełnione to przycisk pozostaje wyłączony.

<html>
<head>
<script language=”JavaScript” type=”text/JavaScript”>

function walidacja()
{
var f = document.forms[‚form1′];
if ((f.chk1.checked) && (f.chk2.checked) && (f.chk3.value != ”))
{
f.s1.disabled = false;
}
else
{
f.s1.disabled = true;
}
}

</script>
</head>
<body>

<form action=”#” id=”f1″>

<input type=”checkbox” name=”w1″ onclick=”walidacja()” />Checkbox 1<br>
<input type=”checkbox” name=”w2″ onclick=”walidacja()” />Checkbox 2<br>
<input type=”text” name=”w3″ onblur=”walidacja()”><br>
<br>
<input type=”submit” name=”s1″ value=”Wyślij” disabled=”disabled” />

</form>
</body>
</html>

 
1 Comment

Posted in JavaScript

 

Leave a Reply

 
*

Preview:

 
  1. TKr

    21 września 2010 at 15:02

    Pomijając całkowicie fakt że przedstawionym przykładzie kod JS i wywoływane obiekty nie pokrywają się z kodem HTML chciałbym zauważyć że walidacja w przypadku textbox’u odbywa się jedynie kiedy go klikniemy – a więc trzeba użyć myszki. Wygląda to mało intuicyjnie. Rozwiązanie ? A jest jak najbardziej :)
    Oprócz onblur, dodać to trzeciego „input” również coś takiego:
    onkeyup=”walidacja()”
    Spowoduje to że validacja będzie przeprowadzana po wpisanie każdego ze znaków w textboksie.

    Pominę już takie kwiatki jak oddzielanie kodu od html , czyli żadnych onkeyupów czy onclicków nie powinno już się stosować – wszystko powinno być wykonywane „na dzień dobry” poprzez podpinanie Eventów, w nagłówku strony – teoretycznie :)

    Przykład:
    http://pokazywarka.pl/83kvts/