| Autor |
Wiadomość |
os_alfa
~user
Dołączył: 31 Maj 2008
Posty: 61
|
|
---------- 19:47 09.01.2010 ----------
Dlaczego tu zliczanie checkboxów działa:
| HTML: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled </title>
</head>
<body>
<form method="post" name=test> |
| Javascript: | <script language="JavaScript1.3">
function licz(form) {
var zaznaczone = 0;
var limit = 3;
var max = form.ckbox.length;
for (var idx = 0; idx < max; idx++) {
if (eval("document.test.ckbox[" + idx + "].checked") == true) {
zaznaczone += 1;
}
}
document.getElementById("check").value=zaznaczone + "/" + max;
}
zaznaczone=0; //jeśli jakieś checkboxy są domyślnie zaznaczone, to tu wpisać ich liczbę
max=2;
function sprawdz(ktory) {
if(!ktory.checked) zaznaczone--; else if(zaznaczone==max) {ktory.checked=0; alert('[komunikat...]');} else zaznaczone++;
}
</script> |
| HTML: |
1 <input type="checkbox" name="ckbox" value="1" onclick="licz(this.form);sprawdz(this)" /> checkbox 1 <BR />
2 <input type="checkbox" name="ckbox" value="2" onclick="licz(this.form);sprawdz(this)" /> checkbox 2 <BR />
3 <input type="checkbox" name="ckbox" value="3" onclick="licz(this.form);sprawdz(this)" /> checkbox 3 <BR />
4 <input type="checkbox" name="ckbox" value="4" onclick="licz(this.form);sprawdz(this)" /> checkbox 4 <BR />
5 <input type="checkbox" name="ckbox" value="5" onclick="licz(this.form);sprawdz(this)" /> checkbox 5 <BR />
6 <input type="checkbox" name="ckbox" value="6" onclick="licz(this.form);sprawdz(this)" /> checkbox 6 <BR />
7 <input type="checkbox" name="ckbox" value="7" onclick="licz(this.form);sprawdz(this)" /> checkbox 7 <BR />
<input type="button" onclick="licz(this.form)" value=" -=lol=- " /><br><br>Zaznaczono :
<input name="check" type="text" size="1">
</form>
</body>
</html> |
A u mnie wyskakuje że jezyk nie jest obiektem lub jest pusty.
| HTML: | <!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head> |
| Javascript: | <script type="text/javascript">
<!--
var kontrolka=0;
function testext(field)
{
var tekst=field.value
var lntext=field.value.length
if (lntext<=2 || lntext>=20)
{
alert("Błąd!!!\nPole musi zawierać od 2 do 20 znaków")
return field.value=""
}
for(var i=0;i<lntext;i++)
{
var litera=tekst.charCodeAt(i)
if (!((litera>=65 && litera<=90) || (litera>=97 && litera<=122) || (litera===211) || (litera===243) || (litera>=260 && litera<=263) || (litera>=280 && litera<=281) || (litera>=321 && litera<=324) || (litera===345) || (litera===347) || (litera>=377 && litera<=380)))
{
alert("Błąd!!!\nPole może zawierać tylko litery")
return field.value=""
break
}
}
}
function testwoj(field)
{
if (field.selectedIndex==0)
alert("Błąd!!!\nProszę wybrać województwo")
}
function testkod(field)
{
var kod=/[\d]{2}-[\d]{3}/
if (!(kod.test(field.value)))
{
alert("Błąd!!!\nNieprawidłowy format kodu")
return field.value=""
}
}
function testmail(field)
{
var mail=/^[0-9a-z_.-]+@+[0-9a-z.-]+\.[a-z]{2,3}$/i
if (!(mail.test(field.value)))
{
alert("Błąd!!!\nNieprawidłowy format maila")
return field.value=""
}
}
function testip(field)
{
var ip=/[\d]{1,3}\.[\d]{1,3}\.[\d]{1,3}\.[\d]{1,3}/
if(!((ip.test(field.value)) || (field.value=="")))
{
alert("Błąd!!!\nNieprawidłowy format ip");
return field.value=""
}
}
function testurl(field)
{
var url=/^(www\.|http:\/\/|https:\/\/|ftp:\/\/)[\w\d\.:#%/;$()~_?\-=\\&]+$/
if(!((url.test(field.value)) || (field.value=="")))
{
alert("Błąd!!!\nNieprawidłowy format url");
return field.value=""
}
}
function testhaslo(field)
{
var haslo=/^.*(?=.{8,})(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).*$/
if(!((haslo.test(field.value))))
{
alert("Błąd!!!\nZa słabe hasło");
return field.value=""
}
}
function liczcheckbox(form)
{
var zaznaczone=0;
var max=form.jezyk.length;
for (var i=0;i<max;i++)
{
if(eval("document.test.jezyk["+i+"].checked")==true)
zaznaczone+=1;
}
alert(zaznaczone);
}
//-->
</script> |
| css: | <style type="text/css">
DIV.red {
background-color:red ;
}
*.center {
text-align: center ;
}
TABLE {
text-align: left ; margin-left: auto ; width: 400 ; margin-right: auto ;
}
td {
text-align:left;
}
</style> |
| HTML: | <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<meta name="Author" content="Krzysztof Wolski" />
<title>Formularz studencki </title>
</head>
<body>
<h4 class="center" title="Wersja 0.1">
Formularz studencki
</h4>
<form id="formularz" action="mailto:wolski.krzysztof@wp.eu?subject=Formularz_studencki" method="post"
onreset="if (!confirm('Czy na pewno chcesz wyczyścić cały formularz?')) return false"
enctype="text/plain">
<hr />
<div class="center red">
Wybierz trzy języki programowania których zamierzasz się uczyć:
</div>
<hr />
<table>
<tr><td>●</td><td><label for="pole0">C</label></td><td><input type="checkbox" name="jezyk" value="c" id="pole0" onmouseup="liczcheckbox(this.form)" /></td></tr>
<tr><td>●</td><td><label for="pole1">C++</label></td><td><input type="checkbox" name="jezyk" value="c++" id="pole1" onmouseup="liczcheckbox(this.form)" /></td></tr>
<tr><td>●</td><td><label for="pole2">Java</label></td><td><input type="checkbox" name="jezyk" value="java" id="pole2" onmouseup="liczcheckbox(this.form)" /></td></tr>
<tr><td>●</td><td><label for="pole3">Pearl</label></td><td><input type="checkbox" name="jezyk" value="pearl" id="pole3" onmouseup="liczcheckbox(this.form)" /></td></tr>
<tr><td>●</td><td><label for="pole4">Delphi</label></td><td><input type="checkbox" name="jezyk" value="delphi" id="pole4" onmouseup="liczcheckbox(this.form)" /></td></tr>
</table>
<hr />
<div class="center red">
Wypełnij dane osobowe(wszystkie pola są wymagane):
</div>
<hr />
<table>
<tr><td>Imię:</td><td><input type="text" name="imie" onblur="testext(this)" /></td></tr>
<tr><td>Nazwisko:</td><td><input type="text" name="nazwisko" onblur="testext(this)" /></td></tr>
<tr><td>Miasto:</td><td><input type="text" name="miasto" onblur="testext(this)" /></td></tr>
<tr><td>Kod pocztowy:</td><td><input type="text" name="kod" maxlength="6" onblur="testkod(this)" /></td></tr>
<tr><td>Województwo:</td><td><select name="wojewodztwo" onblur="testwoj(this)">
<option>Wybierz</option>
<option>Dolnośląskie</option>
<option>Kujawsko-Pomorskie</option>
<option>Lubuskie</option>
<option>Lubelskie</option>
<option>Łódzkie</option>
<option>Małopolskie</option>
<option>Mazowieckie</option>
<option>Opolskie</option>
<option>Podlaskie</option>
<option>Podkarpackie</option>
<option>Pomorskie</option>
<option>Śląskie</option>
<option>Świętkorzyskie</option>
<option>Warmińsko-Mazurskie</option>
<option>Wielkopolskie</option>
<option>Zachodniopomorskie</option>
</select></td></tr>
<tr><td>E-mail:</td><td><input type="text" name="email" onblur="testmail(this)" /></td></tr>
<tr><td>IP:</td><td><input type="text" name="ip" maxlength="15" onblur="testip(this)" /></td></tr>
<tr><td>URL:</td><td><input type="text" name="url" value="http://" onblur="testurl(this)" /></td></tr>
<tr><td>Hasło:</td><td><input type="password" name="haslo" onblur="testhaslo(this)" /></td></tr>
</table>
<div>
<br />
<br />
</div>
<div class="center">
<input type="submit" value="Wyślij" /> <input type="reset" value="Wyczyść" />
</div>
</form>
</body>
</html> |
Proszę się nie przerażać ilością kodu, wstawiłem go całego bo jestem zielony w tym temacie i pomyślałem że coś zepsułem wcześniej. Przepraszam za źle dobrane kolorowanie kodu ale to wydawało mi się odpowiednie dla tego fragmentu. To żółte i tak chyba nie ma znaczenia. Końcowy efekt ma być taki że element po w pierwszej kolumnie tabeli będzie zmieniał kolor z podstawowego na inny po zaznaczeniu checkboxa i zmieni na jeszcze inny jeśli checkbox przekroczy liczbę maksymalną ale najpierw muszę umieć je policzyć i tu się zaczynają schody.
---------- 20:35 ----------
Dobra wiem:D, test to nazwa formularza a nie jakieś cuś z JS
|
|
| Powrót do góry |
|
|
|
|
Nie możesz pisać nowych tematów
Nie możesz odpowiadać w tematach
Nie możesz zmieniać swoich postów
Nie możesz usuwać swoich postów
Nie możesz głosować w ankietach
|
MapaPowered by phpBB © 2001, 2005 phpBB Group
|
|
