Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML] Tabela w formularzu
Forum PHP.pl > Forum > Przedszkole
patpop
Witam.

Mam taki oto formularz:

  1. <form action = "abc.html" method = "post" name = "form1">
  2. </br></br>
  3. <p><b>Tytuł</b></br>
  4. <input type = "text" name = "tytul" />
  5. </p>
  6.  
  7.  
  8. <p><select name = "gdzie"></p>
  9. <option> A </option>
  10. <option> B </option>
  11. <option> C </option>
  12. <option> D </option>
  13. <option> E </option>
  14. <option> F </option>
  15. <br/><br/><br/>
  16.  
  17. <tr><td><input type="radio" name="nazwa" value="wartość" /></td><td><input type="radio" name="nazwa2" value="wartość" /></td></tr>
  18. </br>
  19. <p><input type = "submit" value = "Dodaj!"/></p>
  20.  
  21.  
  22. </form>


W każde komórce tabeli umieściłem pole opcji. Pytanie jest następujący. Czy jest możliwe zrobienie tak aby po kliknięciu w obszar komórki, w której znajduję się pole opcji zostało ono zaznaczone?

Pozdrawiam smile.gif
bostaf
Ale młyn w tym HTMLu smile.gif No ale nic to, nauczysz się wink.gif Na początek posprawdzaj jak niepoprawnie pozamykałeś tagi i wywal <br>. Wyglądu nie ustawia się BRami tylko CSSem.
Odnośnie pytania:
Jest taki tag, który nazywa się label. Służy prawie dokładnie do tego, o co pytasz. Dla przykładu, taki HTML:
  1. <label for="identyfikator_tagu"><input type="radio" name="nazwa" id="identyfikator_tagu">Jakaś opcja</label>

spowoduje, że kliknięcie napisu "Jakaś opcja" zaznaczy guzik opcji. Istotne jest tu aby atrybut id w tagu input był równy atrybutowi for w tagu label.
Żeby label "rozlał się" po całej komórce tabeli, trzeba wykorzystać CSS. W tym przykładzie, który podał kamil4u jest to elegancko zrobione:
  1. style="display:block;width:100%;"

A, i jeszcze jedno. Żeby przyciski opcji działały tak jak powinny, czyli żeby możliwe było wybranie tylko jednej opcji, oba inputy muszą mieć taki sam name. Ty masz name="nazwa" i w drugim name="nazwa2". Dlatego możliwe jest wybranie obu opcji jednocześnie. Zmień tak, żeby oba inputy miały taką sama nazwę.
kamil4u
Ładnie wszystko opisałeś. Sam niestety nie miałem na to czasu. + dla Ciebie smile.gif

Nie zgodę się tylko z
Cytat
jest to elegancko zrobione
lepiej byłoby gdyby to była klasa, a nie przez atrybut style. Jest to ważne przy późniejszych edycjach. Osobiście uznaje atrybut style tylko wtedy, gdy:
a ) testuje coś na szybko
b ) używam w JS: el.style

Chyba, że Twoja wypowiedź tyczy się samego sprytnego rozwiązania poprzez label i CSS, wtedy zgodzę się, że to raczej najrozsądniejsze rozwiązanie, dlatego też do niego linkowałem. Używać tu JS byłoby nieporozumieniem smile.gif
bostaf
Cytat(kamil4u @ 18.05.2012, 23:16:00 ) *
Ładnie wszystko opisałeś. Sam niestety nie miałem na to czasu. + dla Ciebie smile.gif

Nie zgodę się tylko z
Cytat
jest to elegancko zrobione
lepiej byłoby gdyby to była klasa[...]

i + dla Ciebie smile.gif Dzięki za trafne rozwinięcie tematu.
lobopol
Dodam jedną rzecz przy:
  1. <label><input type="radio" name="cos">cos</label>

nie trzeba podawać id jeżeli input znajduje się w label, dodatkowo średni to pomysł aby używać tam tabelki, bo w zupełności wystarczą same odpowiednio ostylowane labele.
kpt_lucek
Poza tym jest jeszcze
smile.gif
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.