Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [HTML] Tabela w formularzu
patpop
post 18.05.2012, 15:12:28
Post #1





Grupa: Zarejestrowani
Postów: 9
Pomógł: 0
Dołączył: 4.11.2011

Ostrzeżenie: (0%)
-----

Witam.

Mam taki oto formularz:

[HTML] pobierz, plaintext 
  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. </select>
  16. <br/><br/><br/>
  17.  
  18. <table>
  19. </table>
  20. <tr><td><input type="radio" name="nazwa" value="wartość" /></td><td><input type="radio" name="nazwa2" value="wartość" /></td></tr>
  21. </br>
  22. <p><input type = "submit" value = "Dodaj!"/></p>
  23.  
  24.  
  25. </form>
[HTML] pobierz, plaintext


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
Go to the top of the page
+Quote Post
kamil4u
post 18.05.2012, 20:06:36
Post #2





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

http://www.tek-tips.com/viewthread.cfm?qid=1266094


--------------------
>>> iPage.pl - JS, HTML5, CSS3, Android - moja oferta
>>> myPrzepis.pl - blog kulinarny
Go to the top of the page
+Quote Post
bostaf
post 18.05.2012, 21:25:45
Post #3





Grupa: Zarejestrowani
Postów: 374
Pomógł: 79
Dołączył: 6.04.2010
Skąd: Ostrów Wielkopolski

Ostrzeżenie: (0%)
-----

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:
[HTML] pobierz, plaintext 
  1. <label for="identyfikator_tagu"><input type="radio" name="nazwa" id="identyfikator_tagu">Jakaś opcja</label>
[HTML] pobierz, plaintext

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:
[HTML] pobierz, plaintext 
  1. style="display:block;width:100%;"
[HTML] pobierz, plaintext

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ę.
Go to the top of the page
+Quote Post
kamil4u
post 18.05.2012, 22:16:00
Post #4





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

Ł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


--------------------
>>> iPage.pl - JS, HTML5, CSS3, Android - moja oferta
>>> myPrzepis.pl - blog kulinarny
Go to the top of the page
+Quote Post
bostaf
post 18.05.2012, 22:24:22
Post #5





Grupa: Zarejestrowani
Postów: 374
Pomógł: 79
Dołączył: 6.04.2010
Skąd: Ostrów Wielkopolski

Ostrzeżenie: (0%)
-----

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.
Go to the top of the page
+Quote Post
lobopol
post 19.05.2012, 09:32:05
Post #6





Grupa: Zarejestrowani
Postów: 1 729
Pomógł: 346
Dołączył: 4.04.2009

Ostrzeżenie: (0%)
-----

Dodam jedną rzecz przy:
[HTML] pobierz, plaintext 
  1. <label><input type="radio" name="cos">cos</label>
[HTML] pobierz, plaintext

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.


--------------------
pehap.pl - moje portfolio
Go to the top of the page
+Quote Post
kpt_lucek
post 19.05.2012, 20:15:25
Post #7





Grupa: Zarejestrowani
Postów: 428
Pomógł: 77
Dołączył: 10.07.2011
Skąd: Warszawa

Ostrzeżenie: (0%)
-----

Poza tym jest jeszcze 
[HTML] pobierz, plaintext 
  1. <fieldset></fieldset>
[HTML] pobierz, plaintext
smile.gif


--------------------


Cytat
There is a Bundle for that
Lukas Kahwe Smith - October 31th, 2014
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 27.04.2025 - 07:39
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn