Je construis un formulaire en HTML hors d'un objet JavaScript que j'ai importé à partir d'un fichier JSON. J'utilise un algorithme de récupération pour construire des tables HTML et des éléments respectifs (étiquettes, boîtes de texte, etc.) Les champs se chargent avec la valeur du nœud actuel.
L'idée est de modifier les valeurs dans les zones de texte; qui à son tour met à jour l'objet JavaScript. Lorsque Des modifications ont été apportées, l'éditeur enverra l'objet JSON au serveur et mettra à jour le fichier.
La question déroutante, est comment puis-je faire référence au nœud qui a été changé? J'ai essayé plusieurs Approches en vain.
EDIT:
C'est une idée de base de ce que je fais: maintenant, Comment puis-je lier la valeur de l'OBJ [clé] dans les zones de texte, de sorte que lorsque je change le
Valeur Il met à jour l'objet JavaScript?
5 Réponses :
Une approche que j'ai vu beaucoup d'autres utilisations est un attribut spécial avec Par exemple: p> data - code> préfixé. likesPie = $("#pie").data("like-pie");
En fait, dans JQuery, vous pourriez juste faire $ ('# tarte'). Données ("comme tarte")
@Inerstellar_Coder: NEAT! Je ne savais pas ça!
UMM, comment cela vous permet-il de mettre à jour l'objet JavaScript original?
Je ne pense pas que quiconque ait traité ma question du tout. Je dois être capable de mettre à jour l'objet global, peu importe la profondeur de l'itération actuelle de l'arborescence.
@Johnnystar: Désolé, je n'ai pas compris la question initiale.
document.getElementById('name').changed = true;
So now the DOM element has the property 'changed'. You can also use any other value (dates, arrays, etc)
Si un élément HTML comporte un attribut non défini via JS, vous ne pouvez pas pouvoir récupérer son attribut dans cette mode sans getattribute . Cependant, si vous savez que l'attribut a été défini avec JS, cela devrait toujours fonctionner.
Vous devez jeter un coup d'œil sur knockoutjs . Il possède un moteur de liaison complet qui met à jour automatiquement les valeurs entre HTML et le modèle d'objet. Donc, tout ce que vous avez à faire est de renvoyer votre modèle JSON chaque fois que les bonnes valeurs ont été entrées dans vos boîtes de texte ou tout ce que vous utilisez pour mettre à jour vos valeurs.
Cela pourrait être surchargé de devoir inclure une bibliothèque entière juste pour cela, bien que si le OP le fait fréquemment, c'est une option.
Vous avez peut-être raison, nous ne pouvons pas savoir, mais cela mérite toujours d'être mentionné.
Tout d'abord, vous avez besoin d'un moyen d'identifier individuellement l'entrée afin que j'ajouterais un attribut Puis je jetterais un gestionnaire d'événements de changement à chaque entrée de texte, une fois l'arborescence construite. clé de données . obj serait un tableau global. J'espère que cela a du sens.
Merci, mais cela ne change pas l'objet préexistant "obj" que je déclare lorsque la page se charge. Je dois pouvoir changer l'objet et ses enfants nœuds afin d'avoir un objet complet à la fin de l'édition afin que je puisse le renvoyer au serveur.
Pouvez-vous nous montrer le contenu de l'objet? Cela pourrait rendre plus facile à comprendre.
UHMM .. c'est la même solution que j'ai écrite avant que celui-ci n'ait été posté.
Cela mettra à jour votre modèle d'origine (global Obj) lorsque les boîtes de texte générées changent.
Lorsque vous utilisez votre fonction d'impression: p> mise à jour à quelque chose comme: $("input[type='text']").change(function()
{
var key = $(this).data("object-key");
obj[key] = $(this).val();
});
Veuillez partager le code indiquant ce que vous avez, qu'est-ce qui ne fonctionne pas et que devrait faire exactement.
Vous recherchez un événement qui déclenche lorsqu'une touche est enfoncée dans la zone de texte? Ou voulez-vous que quelqu'un clique sur un bouton pour modifier les valeurs?
Lorsque la page est chargée, il déclare une variable globale "obj", elle construit un arbre d'éléments. Je veux quand vous modifiez les Textboxes, il modifie l'objet global "obj".
Johnny regarde ma réponse et laissez-moi savoir si cela fonctionne pour vous ou non.
C'est exactement quel knockoutjs fait.
Vous avez oublié d'échapper au
"texte" sur\ "text \"