Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript] Zalezne listy (select)
Komarek
post 31.03.2010, 19:11:33
Post #1





Grupa: Zarejestrowani
Postów: 114
Pomógł: 0
Dołączył: 18.12.2009

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

Witam

Jako ze jestem cienki bolek z js'a prosze o pomoc biggrin.gif



mam cos takiego
Kod
<select name="1">
<option>-Wybierz-</option>
<option>Wybor 1</option>
<option>Wybor 2</option>
</select>

I teraz mam druga liste ale chce by dzialala w taki sposob:

Jezeli w select =1 wybrano opcje Wybor 1, lista wyglada tak

Kod
<select name="11">
<option>-Wybierz-</option>
<option>Wybor 1 -> 1</option>
<option>Wybor 1 -> 2</option>
</select>


natomiast jezeli w pierwszej liscie wybrano opcje Wybor 2, lista ma wygladac tak:

Kod
<select name="21">
<option>-Wybierz-</option>
<option>Wybor 2 -> 1</option>
<option>Wybor 2 -> 2</option>
</select>


Jak to zrobic ? smile.gif

Prosze o pomoc smile.gif
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 9)
#luq
post 31.03.2010, 20:49:43
Post #2





Grupa: Zarejestrowani
Postów: 589
Pomógł: 91
Dołączył: 22.05.2008
Skąd: Gliwice

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

A gdzie atrybuty value do <option />?

Ogólnie możesz ukrywać i wyświetlać dany <select /> (CSS: display) po zdarzeniu onchange.
Tylko należy się zastanowić czy aby na pewno chcesz mieć inne name dla różnych podwyborów bo to może potem komplikować kod po stronie serwera.


--------------------
Moja gra - scraby.io
Go to the top of the page
+Quote Post
Komarek
post 31.03.2010, 21:04:45
Post #3





Grupa: Zarejestrowani
Postów: 114
Pomógł: 0
Dołączył: 18.12.2009

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

znalazlem cos takiego
Kod
http://www.mattkruse.com/javascript/dynamicoptionlist1/


I mam problem aktualnie zeby zrobic PO zatwierdzeniu przyciskiem submit, tak by wartosci sie zapisywaly.
Wie ktos jak to zrobic ? biggrin.gif
Go to the top of the page
+Quote Post
mortus
post 31.03.2010, 21:10:09
Post #4





Grupa: Zarejestrowani
Postów: 2 178
Pomógł: 596
Dołączył: 25.09.2009
Skąd: Piwniczna-Zdrój

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

Przede wszystkim to name nie mogą być takie, ponieważ według standardów name nie może zaczynać się od cyfry.
Cytat
Tylko należy się zastanowić czy aby na pewno chcesz mieć inne name dla różnych podwyborów bo to może potem komplikować kod po stronie serwera.
Zgadzam się. To nie tylko może, ale z pewnością skomplikuje kod po stronie serwera. Zatem name dla select-ów powinno być zawsze jednakowe, natomiast dowolnie możemy modyfikować value każdej opcji.
Go to the top of the page
+Quote Post
Komarek
post 31.03.2010, 22:16:55
Post #5





Grupa: Zarejestrowani
Postów: 114
Pomógł: 0
Dołączył: 18.12.2009

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

name juz pozmienialem itp ...

A jeszcze jedno pytanie zeby nie zakladac dodatkowego tematu:

Jak w javascripcie zrobic cos takiego:

mam
Kod
<select name="droga_w_zyciu">
<option name="asd1">Prosta
<option name="asd2">Kreta
<option name="asd3">Nieskonczona
</select>


I teraz pytanie jak zrobic by w zaleznosci od wyboru w tej liscie,
w ponizszym
Kod
<input type="text">


Pojawial sie tekst wybrany przeze mnie ?

Tzn
jezeli droga_w_zyciu = asd1 to tekst "Wybrales Prosta Droge"
jezeli asd2 to "Wybrales Kreta Droge"

itd...

Pomozcie prosze smile.gif
Go to the top of the page
+Quote Post
mortus
post 1.04.2010, 07:08:38
Post #6





Grupa: Zarejestrowani
Postów: 2 178
Pomógł: 596
Dołączył: 25.09.2009
Skąd: Piwniczna-Zdrój

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

Do wartości wybranego (selected) elementu masz dostęp poprzez jedną z funkcji getElementById, getElementsByTagName, getElementsByClassName, getElementsByName (jedna z tych funkcji nie działa pod IE, ale nie pamiętam która) lub poprzez DOM document.forms[0].name, gdzie name, to name pola. Przykład:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5. 		<script type="text/javascript">
  6. 			function rewrite(source, destination) {
  7. 				document.forms[0].txt.value = source.value;
  8. 				// document.getElementsByName(destination)[0].value = source.value;
  9. 			}
  10. 		</script>
  11.     </head>
  12.     <body>
  13.     	<form action="" method="post">
  14.     		<select name="sel" onchange="rewrite(this, 'txt')">
  15.     			<option value="Wartość 1">Wartość 1</option>
  16. 				<option value="Wartość 2">Wartość 2</option>
  17. 				<option value="Wartość 3">Wartość 3</option>
  18.     		</select>
  19. 			<input type="text" name="txt" />
  20.     	</form>
  21.     </body>
  22. </html>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
Komarek
post 1.04.2010, 08:07:20
Post #7





Grupa: Zarejestrowani
Postów: 114
Pomógł: 0
Dołączył: 18.12.2009

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

fajny motyw z uciekającym przyciskiem szybkiej odpowiedzi tongue.gif

ale niestety nie do konca mi o to chodzi...

potrzebuje skryptu ktory dziala na zasadzie 'if'

mam cos takiego

Kod
<select name="droga_w_zyciu">
<option name="asd1">Prosta
<option name="asd2">Kreta
<option name="asd3">Nieskonczona
</select>


zgodnie z twoja odpowiadzia, skrypt mi wyswietli w polu, asd1 lub asd2 badz asd3.

Jednak ja potrzebuje czegos dzieki czemu OKRESLE wyswietlany tekst ale nie w tagu <option>

cos ala

Kod
if (droga_w_zyciu == "asd1")
<input value="Moj tekst 1">
if (droga_w_zyciu == "asd2")
<input value="Moj tekst 2">
if (droga_w_zyciu == "asd3")
<input value="Moj tekst 3">


Da rade cos takiego zrobic ?
Go to the top of the page
+Quote Post
thek
post 1.04.2010, 08:24:35
Post #8





Grupa: Moderatorzy
Postów: 4 362
Pomógł: 714
Dołączył: 12.02.2009
Skąd: Jak się położę tak leżę :D
Musisz więc odnieść się do elementu który chcesz zmienić i mu atrybut value ustawić w zależności od wyboru. Najprościej gdy ów element ma jakieś id. Podczas zmiany wartości w select (zdarzenie onChange) odwołasz się przez getElementById('tutaj_id_do_zmiany') i ustawisz value.


--------------------
Najpierw był manual... Jeśli tam nie zawarto słów mądrości to zapytaj wszechwiedzącego Google zadając mu własciwe pytania. A jeśli i on milczy to Twój problem nie istnieje :D
Go to the top of the page
+Quote Post
Komarek
post 1.04.2010, 10:37:20
Post #9





Grupa: Zarejestrowani
Postów: 114
Pomógł: 0
Dołączył: 18.12.2009

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

Cytat(Komarek @ 31.03.2010, 20:11:33 ) *
Jako ze jestem cienki bolek z js'a prosze o pomoc biggrin.gif


Gdybys to samo powiedzial mi w php, to wiedzialbym jak zrobic ale dopiero ucze sie js i nie mam zielonego pojecia jak to zrobic.
"Patrzalem" juz w if...else poradnikach js ale nic mi to nie mowi biggrin.gif

add:

ok pokombinowalem tongue.gif

Kod
            function rewrite(source, destination) {
                if(source.value == "wybierz")
                {
                var tekst = "wybierz cos";
                }
                else if(source.value == "asd1")
                {
                var tekst = "Super";
                }
                else if(source.value == "asd2")
                {
                var tekst = "Extra";
                }
                else if(source.value == "asd3")
                {
                var tekst = "Zarabiscie";
                }
                document.forms[0].txt.value = tekst;
                
            }


Ten post edytował Komarek 1.04.2010, 10:57:55
Go to the top of the page
+Quote Post
mortus
post 1.04.2010, 11:03:15
Post #10





Grupa: Zarejestrowani
Postów: 2 178
Pomógł: 596
Dołączył: 25.09.2009
Skąd: Piwniczna-Zdrój

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

Może to Ci rozjaśni trochę sprawę
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5. 		<script type="text/javascript">
  6. 			function confirmChange() {
  7. 				var wybrano = document.getElementById("sel").value;
  8. 				//var wiadomosc = "Wybrałeś pole o wartości " + wybrano;
  9. 				if(wybrano == 1) {
  10. 					var wiadomosc = "Wybrałeś Wartość 1";
  11. 				} else if(wybrano == 2) {
  12. 					var wiadomosc = "Wybrałeś wartość 2";
  13. 				}
  14. 				var gdzie_wpisac = document.getElementById("txt");
  15. 				gdzie_wpisac.value = wiadomosc;
  16. 			}
  17. 		</script>
  18.     </head>
  19.     <body>
  20.         <form action="" method="post">
  21.             <select id="sel" name="sel" onclick="confirmChange();">
  22.                 <option value="1">Wartość 1</option>
  23.                 <option value="2">Wartość 2</option>
  24.             </select>
  25.             <br/>
  26.             <input type="text" id="txt" name="txt" />
  27.             <br/>
  28.             <input type="submit" name="submit" value="Wyślij" />
  29.         </form>
  30.     </body>
  31. </html>
[HTML] pobierz, plaintext
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: Przełącz na: Standardowy · 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: 31.07.2025 - 10:41
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn