données de la table de mise à jour sur la base de la sélection de liste déroulante

Question

I ont une table html de données avec un menu déroulant dans chaque ligne. Si un utilisateur modifie la valeur de la liste déroulante, je veux que les données de cette ligne à changer (sur la base d'un appel de base de données pour rechercher les données associées à la nouvelle valeur de la liste déroulante).

Comme un exemple de base, supposons une table a montré les joueurs sur une équipe de basket-ball avec leurs hauteurs. Imaginez que le joueur est sélectionné dans une liste déroulante ... Je veux la hauteur de ce joueur de changer dans le tableau html si l'utilisateur change le joueur dans cette ligne avec la liste déroulante. Par exemple, si dans le tableau ci-dessous l'utilisateur a modifié le joueur de Kobe Bryant à un autre joueur (comme Ray Allen), la colonne de hauteur changerais basé sur une recherche de base de données de la hauteur de Ray Allen.

Player   Height 
[Kobe Bryant V] 6'6" 
[Dwyane Wade V] 6'4" 

Je voudrais le faire en utilisant jquery ou javascript. En outre, j'utilise CakePHP pour mon site, mais cela peut ne pas être pertinent si tout cela est géré par jquery ou javascript. Merci pour toute aide! Ryan

Answer 1

Il est assez facile avec JQuery. Ajoutez simplement un événement onchange à la liste déroulante et faites en sorte que cet événement fasse une requête AJAX/AJAJ qui puisse renvoyer les nouvelles valeurs HTML dont vous avez besoin.

<select id="player"> 
    <option value="KobeBryant">Kobe Bryant</option> 
    <option value="DwayneWade">Dwayne Wade</option> 
</select> 

et jQuery pour faire la demande (j'utilise JSON ici, vous pouvez également utiliser XML)

$("#player").change(function (event) { 
    $.getJSON('player.php?player=' + $(this).val(), function (json) { 

      // Change data in the table 

    }); 
}); 

http://docs.jquery.com/Ajax/jQuery.getJSON

player.php aurait besoin de revenir JSON dans ce cas, basé sur le joueur que vous l'envoyez.

http://www.json.org/example.html