jQuery et Auto-populat sélectionne

Question

J'ai une page simple où je peux sélectionner un client, puis une fois que j'ai choisi cet autopopulation pour les projets qui appartiennent au client. J'utilise PHP/MySQL pour tirer les résultats.

J'ai pris un coup d'oeil à ceci: http://remysharp.com/2007/01/20/auto-populating-select-boxes-using-jquery-ajax/ mais je pense que cela commence par les deux champs sur la page. J'ai essayé de retravailler le code mais je n'ai pas très bien réussi.

var client_id = $('#c_id').val(); 
    $.getJSON("../inc/get-projects.php", {id: client_id}, function(data){ 
     projects = $('#p_id'); 
     projects.empty(); 
     $.each(data, function() { 
      var option = $('<option/>').attr('value', this.id).text(this.name); 
      projects.append(option); 
     }); 
    }); 

PHP:

<?php 
    include "config.inc.php"; 
    $sth = mysql_query(
     sprintf(
     "SELECT c_id,p_id,p_title FROM projects WHERE c_id = %s", 
     mysql_real_escape_string($_GET['id']) 
     ) 
    ); 
    $projects = array(); 
    while($r = mysql_fetch_assoc($sth)) { 
     $projects[] = array('id' => $r['p_id'], 'name' => $r['p_title']); 
    } 
    print json_encode($projects); 
    exit; 


?> 

Answer 1

Les réponses à cette question pourrait se révéler utile: Using javascript and jquery, to populate related select boxes with array structure

Answer 2

Si vous avez HTML comme ceci:

Vous pouvez avoir le code jQuery comme ceci:

$(document).ready(function() { 
    var $clients = $('#clients'); 
    $clients.change(function() { 
     var client_id = $clients.val(); 
     $.getJSON("getProjects.php", {id: client_id}, function(projects) { 
      $projects = $('#projects'); 
      $projects.empty(); 
      $.each(projects, function() { 
       var option = $('<option/>').attr('value', this.id).text(this.name); 
       $projects.append(option); 
      }); 
     }); 
    }); 
}); 

Et puis ont getProjects.php retourner quelque chose comme:

$sth = mysql_query(
    sprintf(
    "SELECT * FROM projects WHERE client_id = %s", 
    mysql_real_escape_string($_GET['id']) 
    ) 
); 
$projects = array(); 
while($r = mysql_fetch_assoc($sth)) { 
    $projects[] = array('id' => $r['id'], 'name' => $r['name']); 
} 
print json_encode($projects); 
exit; 

Je ne l'ai pas testé tout cela, mais il est plus ou moins ce que vous voulez, je pense.

- Testé et fonctionne, il est évident que ce n'est pas exactement ce dont vous avez besoin, mais cela vous donne une idée de la façon de procéder. J'espère que cela aide.

modifier 2 - Le problème avec votre code est ici:

$.getJSON("../inc/get-projects.php", {id: client_id}, function(projects){ 
    projects = $('#p_id'); 
    projects.empty(); 
    $.each(projects, function() { 
     var option = $('<option/>').attr('value', this.id).text(this.name); 
     projects.append(option); 
    }); 
}); 

Vous écrasez le projects passé dans la fonction avec le projects dans la 2ème ligne. J'ai utilisé un $ dans mon code pour différencier les deux, ce qui n'était peut-être pas le meilleur des moyens. Pour corriger, modifiez le code à ceci:

$.getJSON("../inc/get-projects.php", {id: client_id}, function(data){ 
    projects = $('#p_id'); 
    projects.empty(); 
    $.each(data, function() { 
     var option = $('<option/>').attr('value', this.id).text(this.name); 
     projects.append(option); 
    }); 
});