<select> - czy można odczytać wybór?

[neytiri]

Chciałabym wyświetlać użytkownikowi jego dane w zależności od wybranej opcji w select.
Oglądam lekcje z java script i jquery i nie wiem za bardzo jak się do tego zabrać, bo wszystko muszę połączyć jeszcze z danymi z serwera(czyli php).
Wszystko jest mi potrzebne do edycji i zmiany danych użytkownika.

Czy to w ogóle ma sens takie podejście, bo w sumie php jest po stronie serwera, a js i jq po stronie uzytkownika.
Jak ktoś wie jak się coś takiego robi lub jak się do tego zabrać to napiszcie.

[Morfidon]

Obserwuj przy pomocy jquery zmianę zdarzenia na select boxie. Interesuje Cię zdarzenie .change. Po zmianie na podstawie wartości select boxa (val()) wysyłasz zapytanie przy pomocy ajax do php. PHP na podstawie wartości wybiera odpowiednie rekordy z bazy danych i zwraca wynik, a ajax odbiera. Następnie dane masz w JS więc wyświetlasz dynamicznie bez przeładowania strony dane.

Ajaxem głównie zajmuję się w kursie poświęconym AJAX. W jQuery można stosować AJAX, co więcej stosuje się go prościej, no ale przykładów w kursie AJAX jest dużo więcej niż w jQuery, jeśli chodzi o AJAX co jest logiczne

[neytiri]

Spróbowałam coś takiego :
w pliku html :

Code: Zaznacz cały

<script type="text/javascript">
	$("a").bind({
      click:function(s) {   
         //alert($(this).text());
         $.ajax(
            url:{"data.php"},
            method:{"get"},
            data:{id:$(this).text()},
            dataType:{"html"},
            success: function(data) {
               $("#result").html(data);   
            }
         );
         return false;
      }            
   });	</script>
		
	  <select name="what" id="what">
      <option value="">wybierz</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
   	  </select>

a plik data.php:

Code: Zaznacz cały

<?php

$id=(int)$_GET['id'];
mysql_connect('localhost','login','haslo') or die('brak połączenia');
mysql_select_db('baza');

$q=mysql_query("select * from user where id='{$id}'");
$res=mysql_fetch_assoc($q);

echo "id: ".$res['id']."<br>Imię: ".$res['name']."<br>";

mysql_close();

?>

Część php zrobiłam sama i HTML, ale script już nie - ściągnięty gdzieś z internetu.

Z tego co zrozumiałam, to po wyborze selecta powinno mi wypisać na ekran mojego usera id+imie.
Nic takiego się nie dzieje, czy to jest błąd w skrypcie, czy to ja mieszam wszystko i źle sprawdzam.

[Morfidon]

A gdzie masz coś o identyfikatorze "result" w kodzie pliku html? (nawiązuje do $("#result")). Swoją drogą korzystaj proszę ze znaczników code lub też z np. wklejto.org

[neytiri]

Poprawiłam - czyli tak jak w php odwołuję się teraz do zmiennej res.
Niestety nie działa, chyba coś nie tak jest z tym znacznikiem "a"

Mam taki błąd :
$ is not defined
[Wstrzymuj na tym błędzie]

$("a").bind({

Czy jest w tym jakiś błąd bo właśnie wskazuje na tą linijkę kodu!


Na razie idę krok po kroku po Twoim kursie AJAX. Mam problem z podpowiedziami w aptanie. Jak sobie zrobiłam nowy projekt dodałam plik index.html to od razu mi stworzył taki katalog ./ i tam mi wrzuca upracie mój ajax.js. Niestety wtedy nie działają żadne podpowiedzi jeżeli chodzi o składnie. Czy da się to jakoś ominąć, jak utworzyć plik js z możliwością takich podpowiedzi.

Próbuję sobie jakoś poukładać jak to jest z tymi danymi z różnych skryptów - rozumiem, że jedyny sposób to ładowanie tego do tych tablic globalnych POST i GET ?
Czy dobrze myślę?
Jeżeli tak, to czy gdzieś znajdę jasno wytłumaczone sposoby używania tego, tzn. w jaki sposób w jquery (js - pewnie to samo), ajax to robić?

[Morfidon]

$ is not defined to znaczy, że nie jest zdefiniowane jQuery, dołączyłaś w ogóle jquery.js?

Powinno się obsługiwać zdarzenie change, nie click na select boxie, a nie "a", czyli anchor textie czyli odnośniku...

$("#what").change...

[neytiri]

tak brakowało biblioteki, bo to moje próby z jquery, ale już to naprawiłam.
Teraz mam :

Code: Zaznacz cały

$("document").ready(
		function()
		{
			alert("test");
		}
);


$("#what").change.bind({
			  
   click:function()
   {   
     $.ajax({
             url:"data.php",
             method:"get",
             data:{id:$(this).text()},
             dataType:"htm",
             success: function(data) { $("#res").htm(data); }
            });
     return false;
    }            
       });

Test się wyświetla, więc jquery chodzi.
Jednak wciąż to nie działa.

Odnośnie aptana studio, to przy uruchamianiu przykładu nie wczytuje mi się plik.php. - Lekcja AJAX w praktyce. Wszystko chodzi jak trzeba, tylko nie pokazuje treści z pliku php. Jaki to może być błąd.

[Morfidon]

http://api.jquery.com/change/
Tak ma wyglądać zdarzenie change, nie tak jak jest teraz. Nie jestem pewien co to może być za błąd.

[neytiri]

Już wszystko jest ok, ale ...

Jak zrobić, aby pod tym selectem pojawiały się tylko pola wyboru z bazy ?
Jak na razie to efekt jest taki, że pod spodem ładuje mi znowu cała strona z headem i footem.

Co właściwie odpowiada za to, że znowu zostanie załadowana strona?

[Morfidon]

Zauważyłem, że na razie jeszcze masz w sobie trochę schematycznego myślenia.

W programowaniu nie ma czegoś takiego. Tu jesteś twórcą. Robisz tak jak chcesz i co lepsze... będzie działało tak jak to zrobisz. Gdy coś nie działa to jedynie kogo jest to wina to Twoja, a nie komputera.

Powinno ładować się to co jest w zmiennej data dzięki:
success: function(data) {
$("#result").html(data);
}

natomiast to co znajduje się w data to jest to co zostanie wypisane przy pomocy echo tu:
url:{"data.php"},

.

Strona się przeładowuje, gdy wyślesz taki rozkaz w przeglądarce. Zmienisz np. URL.