Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript]Obsługa formularzy
Forum PHP.pl > Forum > Przedszkole
patryczakowy
11.06.2009, 17:41:41
Witam interesują mnie dwa efekty uzyskane w tej ankiecie http://www.moje-ankiety.pl/wypelnij/kwestionariusz/4967 zaznaczam że temat jest zupełnie przypadkowy 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
11.06.2009, 17:51:47
1. <input type="reset" value="Wyczyść formularz" />
2. Do textarea dodajesz zdarzenie onFocus które zaznacza checkboxa lub radio.
kamil4u
11.06.2009, 17:54:35
Cytat
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();"


Cytat
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
11.06.2009, 18:05:31
Cytat(Maxik @ 11.06.2009, 18:51:47 ) *
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
11.06.2009, 18:10:29
Cytat
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 smile.gif
patryczakowy
11.06.2009, 18:56:09
Coś mi nie wychodzi napisałem taką funkcję
[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2.     function erase(id)
  3.         {
  4.         document.getElementsByName(id).checked = false;
  5.         document.getElementsByName(id).value = '';
  6.         }
  7.  
  8.     </script>
[HTML] pobierz, plaintext

a tak wywołuje czyszczenie
[HTML] pobierz, plaintext 
  1. <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
11.06.2009, 19:40:30
To tak nie działa. Musisz to co zwróci Ci getElementsByName przetworzyć w pętli.
kamil4u
11.06.2009, 20:19:40
Cytat
Musisz to co zwróci Ci getElementsByName przetworzyć w pętli.

Po co 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>
patryczakowy
12.06.2009, 10:46:29
kurcze czegoś w tym javascript nie rozumię przykładowo wygląda odpowiedź tak:
[HTML] pobierz, plaintext 
  1. <a class="erease" href="#" onClick="return confirm('Czy napewno chcesz wyczyszczyć tą odpowiedź?'); erase(13);">(wyczyść odpowiedź...)</a>
  2. <ul><li><input type="checkbox" value="14" name="13[]" id="zaznacz1"/> zaznacz1</li>
  3. <li><input type="checkbox" value="15" name="13[]" id="zaznacz2"/>zaznacz2</li>
  4. <li>
  5. <input type="checkbox" value="16" name="13[]" id="zaznacz3"/> zaznacz3<br/>
  6. <textarea name="13[]" cols="50" rows="1" onfocus="document.getElementById('zaznacz3').checked = true;"></textarea>
  7. </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 
  1. function erase(name)
  2.         {
  3.         tablica=document.getElementsByName(name);
  4.         for (n in tablica)
  5.         {
  6.             tablica[n].checked = false;
  7.         }
  8.  
  9.         }
[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
12.06.2009, 12:33:00
Nie działa bo name masz 13[], a nie 13 smile.gif
patryczakowy
12.06.2009, 13:46:47
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
12.06.2009, 16:24:03
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
13.06.2009, 11:30:29
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 
  1. <form action="?akcja=#" method="post" name="form" onsubmit="return validate(this);">
  2. <!--Przykładowe textarea --!>
  3. <textarea rows="4" cols="60" name="4[]"/>
[HTML] pobierz, plaintext

no i skrypt którym chcę zrobić walidację:
[HTML] pobierz, plaintext 
  1. <script>
  2. function trunc_space(str) { if (str.length>0) while (1) if (str.charAt(0)==" ") str=str.substring(1,str.length) else break
  3.  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;}
  4. </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
13.06.2009, 11:38:03
Nie nazywaj elementów od cyfr!

Kod
form.[4][0].value

?
patryczakowy
13.06.2009, 11:50:37
Cytat(erix @ 13.06.2009, 12:38:03 ) *
Nie nazywaj elementów od cyfr!

Kod
form.[4][0].value

?

No niestety też nie działa 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
13.06.2009, 12:40:46
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
13.06.2009, 13:16:49
Cały czas kombinuję 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
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.