Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JS] Wybór diva z listboxa.
Rewil
post
Post #1





Grupa: Zarejestrowani
Postów: 175
Pomógł: 0
Dołączył: 19.09.2009

Ostrzeżenie: (10%)
X----

Potrzebuję coś takiego uzyskać że jak wybiorę z listboxa jakąś wartość to w zależności od niej wyświetli mi innego diva.(Ukryje jednego, pokaze drugiego)
[HTML] pobierz, plaintext 
  1. 		<script type="text/javascript">
  2. 			function Pole(document.baner_form.elements['kamp_nazwa'].value) {
  3. 				if (document.baner_form.elements['kamp_nazwa'].value=="HTML"){
  4.                                         document.getElementById(file_html).style.display = "block";
  5.                                         document.getElementById(file_obra).style.display = "none";
  6. 				}else{
  7.                                         document.getElementById(file_html).style.display = "none";
  8.                                         document.getElementById(file_obra).style.display = "block";
  9. 				}
  10.  
  11. 			}
  12. 		</script>
  13. 							<div class="file_wgr">
  14. 								<div class="file_1">Rodzaj:
  15. 									<select name="kamp_nazwa[]" size="1" onChange="jump(this.form)">
  16. 										<option value="Obrazek">Obrazek</option>
  17. 										<option value="Flash">Flash</option>
  18. 										<option value="HTML">HTML</option>
  19. 									</select>
  20. 								</div>
  21. 								<div id="file_obra" class="file_2">
  22. 								Obrazek:
  23. 									<input type="hidden" name="MAX_FILE_SIZE" value="3145728000" />
  24. 									<input type="file" size="36" class="file" name="kamp_obrazek[]" />
  25. 								</div>
  26. 								<div id="file_html" class="file_2">
  27. 								Kod HTML:
  28. 									<textarea name="kamp_kod[]"></textarea>
  29. 								</div>
  30. 							</div>
  31.  
[HTML] pobierz, plaintext

I tak jak w tym wypadku: Wybierze się HTML to pokaże się Kod HTML, lub jeśli obrazek to się pokaża Obrazek.
Odrazu mówię że JS to narazie dla mnie czarna magia ;/.
Go to the top of the page
+Quote Post
yevaud
post
Post #2





Grupa: Zarejestrowani
Postów: 471
Pomógł: 89
Dołączył: 29.07.2008
Skąd: Warszawa

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

[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2. 	function Pole(element) {
  3. 		if (element.value=="HTML"){
  4.             document.getElementById('file_html').style.display = "block";
  5.             document.getElementById('file_obra').style.display = "none";
  6.         }else{
  7.             document.getElementById('file_html').style.display = "none";
  8.             document.getElementById('file_obra').style.display = "block";
  9. 		}
  10.  
  11. 	}
  12. </script>
  13. <div class="file_wgr">
  14. 	<div class="file_1">Rodzaj:
  15. 		<select name="kamp_nazwa[]" size="1" onChange="Pole(this)">
  16. 			<option value="Obrazek">Obrazek</option>
  17. 			<option value="Flash">Flash</option>
  18. 			<option value="HTML">HTML</option>
  19. 		</select>
  20. 	</div>
  21. 	<div id="file_obra" class="file_2">
  22. 	Obrazek:
  23. 		<input type="hidden" name="MAX_FILE_SIZE" value="3145728000" />
  24. 		<input type="file" size="36" class="file" name="kamp_obrazek[]" />
  25. 	</div>
  26. 	<div id="file_html" class="file_2">
  27. 	Kod HTML:
  28. 		<textarea name="kamp_kod[]"></textarea>
  29. 	</div>
  30. </div>
  31.  
  32.  
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
Rewil
post
Post #3





Grupa: Zarejestrowani
Postów: 175
Pomógł: 0
Dołączył: 19.09.2009

Ostrzeżenie: (10%)
X----

Jest już dobrze odnośnie listy, lecz potrzeba to jeszcze zglobalizować. Czyli do każdego pola się dotyczyło, a nie pierwszego ;]
http://gamingpl.com/test.html <- teraz tak jest.
Go to the top of the page
+Quote Post
yevaud
post
Post #4





Grupa: Zarejestrowani
Postów: 471
Pomógł: 89
Dołączył: 29.07.2008
Skąd: Warszawa

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

wtedy przede wszystkim nie mozesz uzywac ID bo powinno byc unikalne
zmien sobie id na name, sprawdz getElementsByName i kombinuj (IMG:style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
Rewil
post
Post #5





Grupa: Zarejestrowani
Postów: 175
Pomógł: 0
Dołączył: 19.09.2009

Ostrzeżenie: (10%)
X----

Ale da się uzyskać to bez pętleń, tak jak do tej pory to działa ;]? Bo mając name="jakistam[]", to jest to samo co jakistam[1], jakistam[2] i tak caly czas. A w jsie, chyba tak ladnie tego nie odczyta.
Go to the top of the page
+Quote Post
yevaud
post
Post #6





Grupa: Zarejestrowani
Postów: 471
Pomógł: 89
Dołączył: 29.07.2008
Skąd: Warszawa

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

zauwaz ze to o czym mowisz, tak naprawde juz dziala
jedynym problemem teraz jest to, ze gdy juz chcesz schowac albo pokazac element, musisz wybrac ten wlasciwy div do pokazania ze zbioru file_html albo file_obra

popatrz co dokladnie dostaje teraz funkcja Pole i jak to wykorzystuje, zastanow sie czy jesli masz wiecej elementow to czy nie przydaloby sie cos jeszcze
kombinuj jak zmienic getElementById na getElementByName i ktory ze zbioru Elementsow wtedy pokazac

co do Twojego pytania, to nie potrzebujesz odczytywac wartosci w ten sposob jak podajesz bo ona juz jest odczytana dzieki "this", petla nie jest potrzebna
Go to the top of the page
+Quote Post
Rewil
post
Post #7





Grupa: Zarejestrowani
Postów: 175
Pomógł: 0
Dołączył: 19.09.2009

Ostrzeżenie: (10%)
X----

Cytat(yevaud @ 19.06.2010, 20:28:24 ) *
zauwaz ze to o czym mowisz, tak naprawde juz dziala
jedynym problemem teraz jest to, ze gdy juz chcesz schowac albo pokazac element, musisz wybrac ten wlasciwy div do pokazania ze zbioru file_html albo file_obra

popatrz co dokladnie dostaje teraz funkcja Pole i jak to wykorzystuje, zastanow sie czy jesli masz wiecej elementow to czy nie przydaloby sie cos jeszcze
kombinuj jak zmienic getElementById na getElementByName i ktory ze zbioru Elementsow wtedy pokazac

co do Twojego pytania, to nie potrzebujesz odczytywac wartosci w ten sposob jak podajesz bo ona juz jest odczytana dzieki "this", petla nie jest potrzebna


[HTML] pobierz, plaintext 
  1. 		<script type="text/javascript" src="lib/jquery/jquery-1.3.2.js"></script>
  2. 		<script type="text/javascript" src="lib/jquery/jquery-ui-1.7.2.custom.min.js"></script>
  3. 		<script type="text/javascript" src="jquery-dynamic-form.js"></script>
  4. 		<script type="text/javascript">
  5. 			$(document).ready(function(){
  6. 				$("#duplicate").dynamicForm("#plus", "#minus", {limit:50});
  7. 			});
  8.  
  9. 			function Pole(element) {
  10. 				if (element.value=="HTML"){
  11. 		            document.getElementByName('file_html')[1].style.display = "block";
  12. 		            document.getElementByName('file_obra')[1].style.display = "none";
  13. 		        }else{
  14. 		            document.getElementByName('file_html')[1].style.display = "none";
  15. 		            document.getElementByName('file_obra')[1].style.display = "block";
  16. 				}
  17. 			}
  18. 		</script>
  19. 			<div class="box_trescadm">
  20. 				<div class="b_naglowek">Dodawanie banerów</div>
  21. 				<div class="tresc_wydawcy">
  22. 					<form enctype="multipart/form-data" action="admin.php?opcje=5" method="POST" enctype="multipart/form-data">
  23. 						<?include('admin/lista_kampani.php')?> <a id="plus" href="">Dodaj pole</a> <a id="minus" href="" style="display:none">Usuń ostatnie pole</a>
  24. 						<div id='duplicate'>
  25. 							<div class="file_wgr">
  26. 								<div class="file_1">Rodzaj:
  27. 									<select name="kamp_nazwa[]" size="1" onChange="Pole(this)">
  28. 										<option value="Obrazek">Obrazek</option>
  29. 										<option value="Flash">Flash</option>
  30. 										<option value="HTML">HTML</option>
  31. 									</select>
  32. 								</div>
  33. 								<div name="file_obra[1]" class="file_2">
  34. 								Obrazek:
  35. 									<input type="hidden" name="MAX_FILE_SIZE" value="3145728000" />
  36. 									<input type="file" size="36" class="file" name="kamp_obrazek[]" />
  37. 								</div>
  38. 								<div name="file_html[1]" class="file_2">
  39. 								Kod HTML:
  40. 									<textarea name="kamp_kod[]""></textarea>
  41. 								</div>
  42. 							</div>
  43. 						</div>
  44. 						</div>
  45. 						<input type="submit" class="sub" name="wgraj" value="Dodaj" />
  46. 					</form>
  47. 				</div>
  48. 			</div>
[HTML] pobierz, plaintext


Taki kod nie powinien działać na zasadzie jak z id? To znaczy że pierwsze orginalne divy się chowają, natomiast zduplikowane pozostają bez zmian?
Go to the top of the page
+Quote Post
yevaud
post
Post #8





Grupa: Zarejestrowani
Postów: 471
Pomógł: 89
Dołączył: 29.07.2008
Skąd: Warszawa

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

przede wszystkim getElementsByName
dlatego chcialem uzyc Name ze moze byc wiele elementow o tej samej nazwie na stronie, jesli dodajesz im indeksy to rownie dobrze moze byc to id

widze ze masz jquery, moze zamiast zwyklego javascript uzyjesz troche jego mocy ? (IMG:style_emoticons/default/smile.gif) poczytaj o selektorach w jquery

[JAVASCRIPT] pobierz, plaintext 
  1. function Pole(element) {
  2. 	var container = $(element).parents('div.file_wgr');
  3. 	if (element.value=="HTML"){
  4.         $('div.file_html', container).show();
  5.         $('div.file_obra', container).hide();
  6.     } else {
  7.         $('div.file_html', container).hide();
  8.         $('div.file_obra', container).show();
  9. 	}
  10. }
[JAVASCRIPT] pobierz, plaintext 


[HTML] pobierz, plaintext 
  1. <div class="file_wgr">
  2. 	<div class="file_1">Rodzaj:
  3. 		<select name="kamp_nazwa[]" size="1" onChange="Pole(this)">
  4. 			<option value="Obrazek">Obrazek</option>
  5. 			<option value="Flash">Flash</option>
  6. 			<option value="HTML">HTML</option>
  7. 		</select>
  8. 	</div>
  9. 	<div class="file_obra" class="file_2">
  10. 	Obrazek:
  11. 		<input type="hidden" name="MAX_FILE_SIZE" value="3145728000" />
  12. 		<input type="file" size="36" class="file" name="kamp_obrazek[]" />
  13. 	</div>
  14. 	<div class="file_html" class="file_2">
  15. 	Kod HTML:
  16. 		<textarea name="kamp_kod[]""></textarea>
  17. 	</div>
  18. </div>
[HTML] pobierz, plaintext


Ten post edytował yevaud 19.06.2010, 20:20:02
Go to the top of the page
+Quote Post
Rewil
post
Post #9





Grupa: Zarejestrowani
Postów: 175
Pomógł: 0
Dołączył: 19.09.2009

Ostrzeżenie: (10%)
X----

Raczkuje dopiero w tym JS'ie (Ale już dzięki takiej głupotce wiem coś tam więcej), dzięki wielkie za pomoc. ;]
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 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 Aktualny czas: 15.09.2025 - 03:55
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn