jqueryui autocomplete données personnalisées, création de listes

Question

Je suis en train de construire un formulaire où le premier champ restreint ce qui est disponible dans la seconde, et le second restreint ce qui est disponible dans le troisième. J'essaie d'utiliser la saisie semi-automatique Jqueryui pour cela, mais je rencontre un problème. J'ai essayé un certain nombre d'autres sources en ligne mais je n'arrive pas à l'obtenir. Je suis nouveau à la personnalisation des widgets, ce qui peut expliquer le problème.

Actuellement, je suis capable de publier et recevoir correctement des données de mon fichier php (trouvé ci-dessous), mais la saisie semi-automatique n'affiche pas encore les informations qu'il trouve. Les données sont là, je suis simplement incapable de l'inclure dans la liste déroulante.

Pensées?

$(".tiers input[type='text']").autocomplete({ 
    source: function(request, response) 
    {    
    var $form_data=$('.tiers').parents('form').serialize(); 
     $.ajax({ 
       url: "issue_autocomplete.php", 
       type: "POST", 
       dataType: "json", 
       data:$form_data,              
        success: function(data){ 
        response($.map(data, function(item){ 
         return{  
         label:item.tier1, 
         value:item.tier1      
         } 
       })) 
       } 
     }); 

        }, 
        minLength: 2 
       }); 

Et le php (qui est en train de récupérer des informations très bien)

$tier1=mysql_real_escape_string($_POST['tier1']); 
$tier2=mysql_real_escape_string($_POST['tier2']); 
$tier3=mysql_real_escape_string($_POST['tier3']); 

if($tier1!=''){ 
    $query = mysql_query("SELECT * FROM varIssues WHERE tier1 LIKE '$tier1%'"); 
} 

if($tier2!=''){ 
    $query = mysql_query("SELECT * FROM varIssues WHERE tier1='$tier1' AND tier2 LIKE '$tier2%'"); 
} 

if($tier3!=''){ 
    $query=mysql_query("SELECT * FROM varIssues WHERE tier1 = '$tier1' AND tier2 ='$tier2' AND tier3 LIKE '$tier3%'"); 
} 
    //build array of results 
    for ($x = 0, $numrows = mysql_num_rows($query); $x < $numrows; $x++) { 
     $row = mysql_fetch_assoc($query); 
     $issues[$x] = array('tier1'=>$row["tier1"],'tier2'=>$row['tier2'],'tier3'=>$row['tier3']); 
    } 

    //echo JSON to page 
    $response = $_GET["callback"] . "(" . json_encode($issues) . ")"; 
    echo $response; 

Answer 1

Avec le point-virgule à la fin de la réponse ça marche?

$.ajax({ 
    url: "issue_autocomplete.php", 
    type: "POST", 
    dataType: "json", 
    data:$form_data, 
    success: function(data){ 
     response($.map(data, function(item){ 
      return{ 
        label:item.term1, 
        value:item.term2 
       } 
     })); 
    } 
}); 

Edit: une autre façon d'analyser les résultats peut-être (hypothèse votre déclaration sur les données renvoyées sont correctes - décommenter l'alerte() ci-dessous pour en être sûr

function autocompleteJSONParseCode(data) { 
    var rows = new Array(); 
    var rowData = null; 
    for (var i = 0, dataLength = data.length; i < dataLength; i++) { 
    rowData = data[i]; 
    // alert(rowData.term2+":"+rowData.term1);//uncomment to see data as it parses 
    rows[i] = { 
     value: rowData.term2, 
     label: rowData.term1 
    }; 
    } 

    return rows; 
}; 
$(".tiers input[type='text']").autocomplete({ 
    source: function(request, response) { 
     var $form_data=$('.tiers').parents('form').serialize(); 
     $.ajax({ 
     url: "issue_autocomplete.php", 
     dataType: "json", 
     type: "POST", 
     contentType: "application/json", 
     data:$form_data, 
     success: function(data) { 
      var rows = autocompleteJSONParseCode(data); 
      response(rows); 
     } 
     }); 
    }, 
    minLength: 2 
}); 

Answer 2

Je pense que si tel est le JSON que vous renvoyez

$issues[$x] = array('tier1'=>$row["tier1"],'tier2'=>$row['tier2'],'tier3'=>$row['tier3']); 

Vous devriez y accéder comme celui-ci

  success: function(data){ 
       response($.map(data, function(item){ 
        return{  
        label:item.tier1, 
        value:item.tier2      
        } 
      })) 
      } 

Dans tous les cas si vous avez installé firebug vous pouvez consoler.log les données retournées et vérifier que tout est ok

Answer 3

Ce plug- jQuery. en est peut-être utile pour vous.

http://www.codeassembly.com/Simple-chained-combobox-plugin-for-jQuery/