var answerArr = [];
$(".dropdown-item").on("click", function () {
var value = $(this).val();
answerArr.push(value);
console.log(answerArr);
for (var i = 0; i < answerArr.length; i++) {
console.log(answerArr[i]);
}
$("#answerPlaceholder").text("Answer: " + value)
})
So I have 10 questions and the answers to each question are in a dropdown menu. Im pushing each answer value to an array but my problem is if someone changes their answer it will just add to the array instead of changing the answer. How do i make it so when an answer is changed it will delete the old value from the array and replace it with the new value?...not sure if the code will help. Thanks.
3 Réponses :
Vous avez besoin de chaque liste déroulante pour avoir un identifiant code> ou p> ou code>, puis au lieu de pousser leurs valeurs à un tableau, vous les ajouteriez en une nouvelle entrée sur un objet. , en utilisant leur id code> ou nom code> comme clé. Vous pouvez ensuite convertir cet objet à la matrice à l'aide de objet.values () code> si vous en avez besoin:
<label>
Question 1
<select name="q1">
<option></option>
<option>Answer 1A</option>
<option>Answer 1B</option>
<option>Answer 1C</option>
<option>Answer 1D</option>
</select>
</label>
<label>
Question 2
<select name="q2">
<option></option>
<option>Answer 2A</option>
<option>Answer 2B</option>
<option>Answer 2C</option>
<option>Answer 2D</option>
</select>
</label>
<label>
Question 3
<select name="q3">
<option></option>
<option>Answer 3A</option>
<option>Answer 3B</option>
<option>Answer 3C</option>
<option>Answer 3D</option>
</select>
</label>
<label>
Question 4
<select name="q4">
<option></option>
<option>Answer 4A</option>
<option>Answer 4B</option>
<option>Answer 4C</option>
<option>Answer 4D</option>
</select>
</label>
<pre id="result"></pre>
Plutôt que de faire un Ensuite, une fois que vous avez un index, remplacez .push dans un tableau, vous voudrez envisager définir une valeur à un index donné . Avant de pouvoir le faire, vous devez savoir quelle question a cliqué sur .dropdown-item est associé à. Il existe différentes façons de faire cela, par exemple:
index de questions-questions-index à chacun. Ensuite, vous devriez pouvoir obtenir l'index comme const index = parseint ($ (ceci) .parent (). Données ("Question-index"), 10) . .
const index = réponsedropdowns.indexof ($ (ceci) .parent ())
ananach.push (...) avec an "index] = ... . .
@Danziger et j'ai fait quelque chose de assez similaire.
const answerMap = {};
$(".dropdown-item").on("change", function() {
var value = $(this).val();
var question = $(this)[0].id;
answerMap[question] = value;
$("#answerPlaceholder").text("Answer: " + JSON.stringify(answerMap, null, 2));
});
Pouvez-vous ajouter ce que votre HTML ressemble? Avez-vous dix menus déroulants différents et vous utilisez le même gestionnaire de clic pour chacun d'eux?
Oui, 10 menus déroulants différents avec le même nom de classe.
Serait-il plus facile si j'ai généré chaque question via JavaScript à la place?
Soit cela (afin que vous puissiez avoir une variable d'index de boucle) ou de joindre un attribut - aux éléments DOM afin que vous sachiez quel index pour mettre les réponses à.