Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [HTML][JavaScript][jQuery]Select zależny od div
webmaniak
post
Post #1





Grupa: Zarejestrowani
Postów: 371
Pomógł: 30
Dołączył: 14.04.2010

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

Witam,
mam pewien kod:
[HTML] pobierz, plaintext 
  1. <script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
  2. <script src="http://code.jquery.com/jquery-migrate-1.1.0.min.js"></script>
  3. <form method="POST">
  4.  
  5.     <select id="wybor">
  6.         <option value="pierwszy">PHP</option>
  7.         <option value="drugi">JS</option>
  8.         <option value="trzeci">CSS</option>
  9.         <option value="czwarty">Ajax</option>
  10.         <option value="piaty">jQuery</option>
  11.     </select>    
  12.  
  13.  
  14. </form>
  15.  
  16. <div id="jezyk">
  17.     Ajax
  18. </div>
  19.  
  20.  
  21.  
  22.  
  23.  
  24. <script type="text/javascript">
  25.     $(document).ready(function() {
  26.         $('#jezyk').on('click', function() {
  27.             $('#wybor').val($('#jezyk').html());
  28.         })
  29.     });
  30. </script>
[HTML] pobierz, plaintext

Chciałbym aby po kliknięciu na element o id jezyk zmienił się select na wartość taką jaka jest w tym divie. W divie może być dowolna wartość z selecta, może też być to pusty element. Kod który przedstawiłem nie działa mi, nie zmienia nic, nie wiem czemu. Jestem zielony w jQuery i nie wiem jak sobie z tym poradzić. Pomoże ktoś?

Ten post edytował webmaniak 25.02.2013, 19:55:06
Go to the top of the page
+Quote Post
bpskiba
post
Post #2





Grupa: Zarejestrowani
Postów: 340
Pomógł: 49
Dołączył: 3.07.2009
Skąd: Rzeszów

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

[HTML] pobierz, plaintext 
  1. <HTML>
  2. <body>
  3.  
  4.     <form method="POST">
  5.     <select id="wybor" onchange="kk(this)">
  6.     <option value="pierwszy">PHP</option>
  7.     <option value="drugi">JS</option>
  8.     <option value="trzeci">CSS</option>
  9.     <option value="czwarty">Ajax</option>
  10.     <option value="piaty">jQuery</option>
  11.     </select>
  12.    </form>
  13.  
  14.     <div id="jezyk">
  15.     Ajax
  16.     </div>
  17.  
  18. <script type="text/javascript">
  19. function kk(e)
  20.   {
  21.    switch(e.value)
  22.      {
  23.      case"pierwszy": document.getElementById("jezyk").innerHTML="PHP";
  24.                       break;
  25.      case"drugi": document.getElementById("jezyk").innerHTML="JS";
  26.                       break;
  27.      case"trzeci": document.getElementById("jezyk").innerHTML="CSS";
  28.                       break;
  29.      case"czwarty": document.getElementById("jezyk").innerHTML="Ajx";
  30.                       break;
  31.      case"piaty": document.getElementById("jezyk").innerHTML="jQuery";
  32.                       break;
  33.      }
  34.  }
  35.     </script>
  36. <body></HTML>
[HTML] pobierz, plaintext

Zrób mi przyjemność i zapomnij o istnieniu jquery............
Go to the top of the page
+Quote Post
webmaniak
post
Post #3





Grupa: Zarejestrowani
Postów: 371
Pomógł: 30
Dołączył: 14.04.2010

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

Hmm, dzięki za odpowiedź i kod. Zrobiłeś ale odwrotnie, div zależny od select-był tak zatytułowany wątek-ale przez pomyłkę, dlatego zmieniłem (IMG:style_emoticons/default/smile.gif) . Mi chodzi o zrobienie selecta zależnego od diva. No i druga uwaga, nie mogą to być statyczne elementy. Bo w divie jest tekst pobierany z bazy, a w select również z tej samej kolumny, ale wszystkie wiersze. Chodzi po prostu o to że jak kliknę na div to select ustawia się na np. na ajax i będzie filtrowało wyniki po tym wyborze. Filtrowanie zrobione, ale właśnie z tym divem i selectem nie umiem sobie poradzić.
A drugie pytanie: czemu zrezygnować z jQuery? jakiś argument lub link do artykułu/wpisu/argumentów przeciwko temu frameworkowi? Bo z moich informacji wynika że jest on rozwijany i coraz bardziej popularny.

Ten post edytował webmaniak 25.02.2013, 20:56:31
Go to the top of the page
+Quote Post
foxbond
post
Post #4





Grupa: Zarejestrowani
Postów: 162
Pomógł: 12
Dołączył: 20.12.2009
Skąd: Siedlce

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

Kolega miał na myśli, że do tak prostych zadań nie trzeba includować frameworka...


W sumie to najlepiej zrób for-a po stronie php żeby generować tego switch-a i już masz dynamicznie. Możesz też przechowywać opcje wyboru w jakiejś zmiennej (która wygenerujesz po stronie php) i na niej sprawdzać
Go to the top of the page
+Quote Post
webmaniak
post
Post #5





Grupa: Zarejestrowani
Postów: 371
Pomógł: 30
Dołączył: 14.04.2010

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

Cytat(foxbond @ 25.02.2013, 21:08:34 ) *
Kolega miał na myśli, że do tak prostych zadań nie trzeba includować frameworka...

Ok, będę pamiętał, tylko że w tym przypadku chce to zrobić w ramach już istniejącej aplikacji internetowej, gdzie jQuery jest używany w wielu miejscach.

Cytat(foxbond @ 25.02.2013, 21:08:34 ) *
W sumie to najlepiej zrób for-a po stronie php żeby generować tego switch-a i już masz dynamicznie.

nie za bardzo widzę to rozwiązanie z forem. Możesz pokazać jakiś przykład(pseudokod)?
Cytat(foxbond @ 25.02.2013, 21:08:34 ) *
Możesz też przechowywać opcje wyboru w jakiejś zmiennej (która wygenerujesz po stronie php) i na niej sprawdzać

Jedyne co w takiej opcji wchodzi w grę to sesja, ponieważ select znajduje się w innym pliku niż ten div(w aplikacji - bo przykład uprościłem trochę (IMG:style_emoticons/default/smile.gif) )
Dlatego zależy mi na tym co napisałem - klikam i ustawia się select z wartością z diva.
Go to the top of the page
+Quote Post
bpskiba
post
Post #6





Grupa: Zarejestrowani
Postów: 340
Pomógł: 49
Dołączył: 3.07.2009
Skąd: Rzeszów

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

Nie bardzo rozumiem jaki sens ma ta odwrotność. Przecież generując stronę zamiast wyświetlać "Ajax" możesz wstawić dowolną treść po stronie serwera.
Tutaj chyba php potrzeba a nie jquery czy js.

odwrotnie:

[HTML] pobierz, plaintext 
  1. <HTML>
  2. <body onload="kk()";>
  3.  
  4.     <form method="POST">
  5.     <select id="wybor">
  6.     <option value="pierwszy">PHP</option>
  7.     <option value="drugi">JS</option>
  8.     <option value="trzeci" selected>CSS</option>
  9.     <option value="czwarty">Ajax</option>
  10.     <option value="piaty">jQuery</option>
  11.     </select>
  12.    </form>
  13.     <div id="jezyk">
  14.     Ajax
  15.     </div>
  16.  
  17. <script type="text/javascript">
  18. function kk()
  19.   {
  20.   var e=document.getElementById("wybor");
  21.    switch(e.value)
  22.      {
  23.      case"pierwszy": document.getElementById("jezyk").innerHTML="PHP";
  24.                       break;
  25.      case"drugi": document.getElementById("jezyk").innerHTML="JS";
  26.                       break;
  27.      case"trzeci": document.getElementById("jezyk").innerHTML="CSS";
  28.                       break;
  29.      case"czwarty": document.getElementById("jezyk").innerHTML="Ajx";
  30.                       break;
  31.      case"piaty": document.getElementById("jezyk").innerHTML="jQuery";
  32.                       break;
  33.      }
  34.  }
  35.     </script>
  36. <body></HTML>
[HTML] pobierz, plaintext


Ten post edytował bpskiba 25.02.2013, 21:51:45
Go to the top of the page
+Quote Post
webmaniak
post
Post #7





Grupa: Zarejestrowani
Postów: 371
Pomógł: 30
Dołączył: 14.04.2010

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

Ok, to działa, ale cały czas nie o to mi chodzi. Chodzi o to że takich divów będzie mnóstwo. W tym przykładzie co podałeś select się zmienia po załadowaniu strony, w moim przypadku to odpada. Dlatego kombinuję w jQuery.

Bingo, to co potrzebuję:
http://jsfiddle.net/jchiotaka/uaLXU/
Oczywiście muszę to dostosować do swoich potrzeb, jeśli będę miał duże problemy to oczywiście skorzystam z Waszej dobroci(pomocy) (IMG:style_emoticons/default/smile.gif) ale powinno pójść z górki teraz (IMG:style_emoticons/default/smile.gif)

Ten post edytował webmaniak 26.02.2013, 08:51:44
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: 30.08.2025 - 01:29
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn