2009-10-05 8 views
1

Je suis sûr que je manque juste quelque chose, mais ce serait vraiment utile si quelqu'un sait d'une manière de faire ceci sans appeler un plugin de jquery.Comment accrocher la réponse json au formulaire html via jquery?

Supposons que j'ai un simple formulaire HTML comme ce qui suit:

<form id="mainform" action="form.php" method="post"> 
    <fieldset> 
    <legend>Main Form</legend> 
     <label for="input1">First Input</label> 
     <input id="input1" name="input1" type="text" /> 
     <label for="input2">First Input</label> 
     <input id="input2" name="input2" type="text" /> 
    </fieldset> 
</form> 

Et j'ai une fonction ajax, via jquery, que je veux remplir le formulaire ci-dessus. Pas seulement les valeurs, mais aussi si c'est en lecture seule, la classe de l'entrée, et si elle est désactivée.

Ainsi, le serveur va revenir tout cela à la fonction ajax en format JSON, ce qui devrait ressembler à:

{"input1":{"value":10},"input2":{"value":100,"readonly":"readonly","class":"noinput"}} 

est-il un moyen simple d'avoir aller jquery à travers chaque objet de niveau supérieur , liez-le à l'élément DOM avec l'ID correspondant, puis définissez tous les sous-objets en tant qu'attributs pour cet ID?

Désolé, ce n'est pas une évidence. Je ne trouve pas la bonne façon de traiter avec json dans les principales pages jquery.

Répondre

2
for(var element in json){ 
    for(var attribute in json[element]){ 
     $('#' + element).attr(attribute, json[element][attribute]); 
    } 
} 
+0

Je pense que cela semble bon. Merci! Et la définition de l'attribut "value" est aussi bonne que la définition de 'element.val()', n'est-ce pas? – Anthony

+0

Oui, les paramètres $ ('# input1'). Attr ('value', 123) définiront la valeur du champ. – Matt

1

Vous ne avez pas besoin de plug-ins:

$.post("/page/", 
    "", 
    function(json){ 
     try{ 

     //relevant part 
     for(element in json){ 
      $(element).val(json[element]); 
     } 
     //end of relevant part 

     }catch(e){alert(e.description);} 
    }, "json"); 

Matt's answer est correct, j'ai mal lu la réponse json. C'est un gestionnaire plus simple, car il ne prend en compte que les valeurs de texte des éléments.

0

Que pensez-vous de cela?

jQuery.each(jsonObject, function(input_idx, input_val) 
{ 
    var input = $('#' + input_idx); 
    jQuery.each(input_val, function(attr_idx, attr_val) 
    { 
     input.attr(attr_idx, attr_val); 
    }); 
}); 

Ou vous pouvez simplement utiliser simple pour les boucles:

for (var input_idx in jsonObject) 
{ 
    var input_val = jsonObject[input_idx]; 
    var input = $('#' + input_idx); 
    for (var attr_idx in input_val) 
    { 
     input.attr(attr_idx, input_val[attr_idx]); 
    }); 
}); 
Questions connexes