jQuery autocomplete: prise d'entrée JSON et définition de plusieurs champs à partir d'un seul champ

Question

J'essaye d'obtenir le plugin jQuery autocomplete pour prendre une variable JSON locale en entrée. Une fois que l'utilisateur a sélectionné une option dans la liste de saisie semi-automatique, je souhaite que les champs d'adresse adjacents soient automatiquement copiés.

est ici la variable JSON déclarée en tant que variable globale dans le du fichier HTML:

varJSON_address={ 
    "1": { 
     "origin": { 
      "nametag": "Home", 
      "street": "Easy St", 
      "city": "Emerald City", 
      "state": "CA", 
      "zip": "9xxxx" 
     }, 
     "destination": { 
      "nametag": "Work", 
      "street": "Factory St", 
      "city": "San Francisco", 
      "state": "CA", 
      "zip": "94104" 
     } 
    }, 
    "2": { 
     "origin": { 
      "nametag": "Work", 
      "street": "Umpa Loompa St", 
      "city": "San Francisco", 
      "state": "CA", 
      "zip": "94104" 
     }, 
     "destination": { 
      "nametag": "Home", 
      "street": "Easy St", 
      "city": "Emerald City ", 
      "state": "CA", 
      "zip": "9xxxx" 
     } 
    } 
} 

Je veux que le premier champ pour afficher une liste d ' « origine » nametags: « Home », « travail » . Puis, quand "Home" est sélectionné, les champs adjacents sont automatiquement avec la rue: Facile St, Ville: Emerald City, etc.

Voici le code que j'ai pour la saisie semi-automatique:

$(document).ready(function(){ 

    $("#origin_nametag_id").autocomplete(JSON_address, { 
     autoFill:true, 
     minChars:0, 
     dataType: 'json', 
     parse: function(data) { 
      var rows = new Array(); 
      for (var i=0; i<=data.length; i++) { 
       rows[rows.length] = { data:data[i], value:data[i].origin.nametag, result:data[i].origin.nametag }; 
      } 
      return rows; 
     } 
    }).change(function(){ 
     $("#street_address_id").autocomplete({ 
      dataType: 'json', 
      parse: function(data) { 
      var rows = new Array(); 
      for (var i=0; i<=data.length; i++) { 
       rows[rows.length] = { data:data[i], value:data[i].origin.street, result:data[i].origin.street }; 
      } 
      return rows; 
      } 
     }); 
    }); 
}); 

Donc cette question vraiment a deux sous-parties: 1) Comment obtenez-vous la saisie semi-automatique pour traiter l'objet JSON multidimensionnel? (Lorsque le champ est cliqué et que le texte est saisi, rien ne se passe - pas de liste) 2) Comment remplir les autres champs (rue, ville, etc.) en fonction du sous-tableau d'étiquettes d'origine?

Merci d'avance!

Answer 1

Juste un rapide, je crois que la boucle est faux ici, a donné lieu à rien affiché dans la liste

for (var i=0; i<=data.length; i++) {} 

il devrait être

for (var i=0; i<data.length; i++) {} 

inférieur ou égal (< =) aura pour résultat dans un tableau non défini en lignes