[JavaScript]Obsługa formularzy Opcje

[patryczakowy]

Witam interesują mnie dwa efekty uzyskane w tej ankiecie http://www.moje-ankiety.pl/wypelnij/kwestionariusz/4967 zaznaczam że temat jest zupełnie przypadkowy (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) .
Chodzi mi w jaki sposób uzyskać taki efekt jak jest tam po kliknięciu wyczyść odpowiedź.
A drugi są pytania otwarte pola textarea po kliknięci którego zaznacza się od razu odpowiedź w tym momencie jest to checkbox ale interesują mnie również kontrolki typu radio.
Za wszelkie rady i sugestię będę bardzo wdzięczny.

[Maxik]

1. <input type="reset" value="Wyczyść formularz" />
2. Do textarea dodajesz zdarzenie onFocus które zaznacza checkboxa lub radio.

[kamil4u]

Chodzi mi w jaki sposób uzyskać taki efekt jak jest tam po kliknięciu wyczyść odpowiedź.

Kod

onClick="return confirm('Tu pytanie?'); funkcja_czyszcząca_ pola();"

A drugi są pytania otwarte pola textarea po kliknięci którego zaznacza się od razu odpowiedź w tym momencie jest to checkbox ale interesują mnie również kontrolki typu radio.

Kod

<input type="checkbox" id="test"><textarea onfocus="document.getElementById('test').checked = true;">

[patryczakowy]

1. <input type="reset" value="Wyczyść formularz" />

Właśnie nie chcę inputa tylko taki link jak jest tu w ankiecie i żeby czyścił nie cały formularz tylko jedną odpowiedź
drugie zaraz przetestuje i zobaczę czy o to mi chodziło
WIELKIE DZIĘKI ZA RADĘ

z zaznaczeniem chcboxa działa Jeszcze raz dzięki .
Jeszcze jak by mi ktoś lekko podpowiedział jak powinna wyglądać funkcja czyszcząca tylko jedno pytanie

[kamil4u]

Jeszcze jak by mi ktoś lekko podpowiedział jak powinna wyglądać funkcja czyszcząca tylko jedno pytanie

Dla checkbox-a, radio:

Kod

referencja_do_elementu.checked = false;

Dla textarea,input type="text":

Kod

referencja_do_elementu.value = '';

referencja_do_elementu:
- document.getElementById
- document.getElementsByName
- document.getElementsByTagName
- inne - rzadko używane to nie podaje (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

[patryczakowy]

Coś mi nie wychodzi napisałem taką funkcję

[HTML] pobierz, plaintext 
<script type="text/javascript">
    function erase(id)
        {
        document.getElementsByName(id).checked = false;
        document.getElementsByName(id).value = '';
        }
 
    </script>
[HTML] pobierz, plaintext 

a tak wywołuje czyszczenie

[HTML] pobierz, plaintext 
<a class="erease" href="#" onClick="return confirm('Czy napewno chcesz wyczyszczyć tą odpowiedź?'); erase(2);">(wyczyść odpowiedź...)</a>
[HTML] pobierz, plaintext 

a wszystkie checkboxy kontrolki radio lub pola textarea mają name ustawione na 2

[Maxik]

To tak nie działa. Musisz to co zwróci Ci getElementsByName przetworzyć w pętli.

[kamil4u]

Musisz to co zwróci Ci getElementsByName przetworzyć w pętli.

Po co (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) - no chyba, że chcesz usunąć wszystko co ma 'name' = 2, ale z tego co zrozumiałem wyżej jest inaczej:

Kod

<script type="text/javascript">
function eraseCheck(name)
{
document.getElementsByName(name)[0].checked = false;
}
function eraseValue(name)
{
document.getElementsByName(name)[0].value = '';
}
</script>

Ten post edytował kamil4u 11.06.2009, 20:21:17

[patryczakowy]

kurcze czegoś w tym javascript nie rozumię przykładowo wygląda odpowiedź tak:

[HTML] pobierz, plaintext 
<a class="erease" href="#" onClick="return confirm('Czy napewno chcesz wyczyszczyć tą odpowiedź?'); erase(13);">(wyczyść odpowiedź...)</a>
<ul><li><input type="checkbox" value="14" name="13[]" id="zaznacz1"/> zaznacz1</li>
<li><input type="checkbox" value="15" name="13[]" id="zaznacz2"/>zaznacz2</li>
<li>
<input type="checkbox" value="16" name="13[]" id="zaznacz3"/> zaznacz3<br/>
<textarea name="13[]" cols="50" rows="1" onfocus="document.getElementById('zaznacz3').checked = true;"></textarea>
</li></ul>
[HTML] pobierz, plaintext 

i po kliknięciu chcę wyczyszczyć wszystkie odpowiedzi z name="13[]" więc tak jak tu kolega poradził jeśli wszystkie to trzeba w pętli przejechać

[HTML] pobierz, plaintext 
function erase(name)
        {
        tablica=document.getElementsByName(name);
        for (n in tablica)
        {
            tablica[n].checked = false;
        }
 
        }
[HTML] pobierz, plaintext 

no i nie działa nie działa mi też sposób ten document.getElementsByName(name)[0].checked = false; co rozumiem że powinien w tym wypadku wyczyszczyć pierwszy element z tablicy?

[kamil4u]

Nie działa bo name masz 13[], a nie 13 (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

[patryczakowy]

jak zmienię na 13 to też nie działa a po za tym potrzebuje to w skrypcie php odebrać jako tablicę więc musi być 13[]

[kamil4u]

Kod

<script>
function erase(n,t,a,i){
if(!confirm('Czy napewno chcesz wyczyszczyć tą odpowiedź?'))
  return false;

t=document.getElementsByName(n);
for(i=0; a=t[i++];){
  if(a.type == 'radio' || a.type == 'checkbox')
    a.checked = false;
  else
    a.value = '';
}
return true;
}
</script>

<a class="erease1" href="#" onClick="return erase('13[]');">(wyczyść odpowiedź...)</a>

<ul><li><input type="checkbox" value="14" name="13[]" id="zaznacz1"/> zaznacz1</li>
<li><input type="checkbox" value="15" name="13[]" id="zaznacz2"/>zaznacz2</li>
<li>
<input type="checkbox" value="16" name="13[]" id="zaznacz3"/> zaznacz3<br/>
<textarea name="13[]" cols="50" rows="1" onfocus="document.getElementById('zaznacz3').checked = true;"></textarea>
</li></ul>

[patryczakowy]

Wielkie dzięki teraz elegancko działa nawet rozszerzyłem to o pola typu select jedno jest pewne bez waszej pomocy jeszcze troszkę bym czasu przy tym spędził no cóż pora sobie zakupić jakąś nową lekturę z javascriptu.

no i znowu się zaciąłem przy tych tablicach, a więc teraz mam problem z walidacją formularza:

[HTML] pobierz, plaintext 
<form action="?akcja=#" method="post" name="form" onsubmit="return validate(this);">
<!--Przykładowe textarea --!>
<textarea rows="4" cols="60" name="4[]"/>
[HTML] pobierz, plaintext 

no i skrypt którym chcę zrobić walidację:

[HTML] pobierz, plaintext 
<script>
function trunc_space(str) { if (str.length>0) while (1) if (str.charAt(0)==" ") str=str.substring(1,str.length) else break
 return str } function validate(form){ var p=0;if (trunc_space(form.4[0].value).length < 15))  alert("Odpowiedź na pytanie nr 3 jest nieprawidłowa, zbyt krótka, min.  to 15 znaków.");p=1} else if (trunc_space(form.4[0].value)=="") alert("Nie została udzielona odpowiedź na pytanie nr 3 ");p=1} else if (trunc_space(form.3[0].value).length < 15)) alert("Odpowiedź  na pytanie nr 4 jest nieprawidłowa, zbyt krótka, min. to 15  znaków.");p=1} else if (trunc_space(form.3[0].value)=="") alert("Nie została udzielona odpowiedź na pytanie nr 4 ");p=1} else  {p=0}; if (p==0) return true;  else return false;}
</script>
[HTML] pobierz, plaintext 

Nie działa mi żaden zapis:
form.4[0].value
form.4[].value
form.4.value
Z góry dzięki za rady

[erix]

Nie nazywaj elementów od cyfr!

Kod

form.[4][0].value

?

[patryczakowy]

Nie nazywaj elementów od cyfr!

Kod

form.[4][0].value

?

No niestety też nie działa (IMG:http://forum.php.pl/style_emoticons/default/sad.gif)
A jeśli chodzi o nazywanie elementów to normalnie tego nie robię ale teraz robię coś na wzór www.moje-ankiety.pl, takie formularze generowane z bazy danych i stąd takie nazwy jest to po prostu id pytania

[erix]

Ajjj, mój błąd:

Kod

form.elements[4][0].value

Ale wątpię, aby to zadziałało. Swoją drogą, przez tyle czasu mogłeś sam pokombinować.

Zmień identyfikatory na prawidłowe, zgodne ze specyfikacją: http://www.w3.org/TR/html401/types.html#type-name

[patryczakowy]

Cały czas kombinuję (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) w ostateczności zrezygnowałem przy textarea z tablicy po za tym brakowało parę klamer i ostateczna forma wyszła mi taka

Kod

document.form.open_4.value

Dzięki za rady