J'ai écrit cette pièce avec l'espoir de stocker le nom et le score dans chaque élément du tableau.

Sortie attendue:

 var students = [
    ['David', 80],
    ['Dane', 77],
    ['Dick', 88],
    ['Donald', 95],
    ['Dean', 68]
    ];

Cependant, je trébuche en assignant la deuxième valeur dans un élément de tableau ... Dans codepen.io, la valeur renvoyée est "a".

HTML:

name: <input type="text" id="namebox"><br><br>
score: <input type="text" id="scorebox"><br><br>

<input type="button" value="Add" onclick="addStudent()">

<input type="button" value="Display" onclick="displayArray()">

Javascript:

var x = 0;
var students = [];

function addStudent(){
    students[x] = document.getElementById("namebox").value;
    students[x][1] = document.getElementById("scorebox").value;
    alert(students[x] + " added");
    x++;
    document.getElementById("namebox").value = "";
    document.getElementById("scorebox").value = "";
    document.getElementById("namebox").focus();
    document.getElementById("scorebox").focus();
}

function displayArray(){
    var e = "<hr>";

    for (y = 0; y < students.length; y++)
    {
        e += students[y] + students[y][1] + "<br>";
    }
    document.getElementById("result").innerHTML = e;
}
0
Ah Quan 14 janv. 2017 à 14:52

2 réponses

Meilleure réponse

Comme suggéré par @ Y.C. si vous ajoutez students[x][0] = document.getElementById("namebox").value;, votre code fonctionnera. Je veux proposer juste une modification mineure pour que votre tableau json garde son "motif". Placez document.getElementById("scorebox").value dans parseInt() pour obtenir le score sous forme de nombre. En d'autres termes, écrivez simplement parseInt(document.getElementById("scorebox").value);

MISE À JOUR

Puisque ma suggestion précédente ne fonctionne que si vous avez prédéfini le tableau, j'ai édité le code donc maintenant cela devrait fonctionner.

Au lieu d'attribuer la valeur à chaque cellule, j'ai utilisé la fonction push (), donc maintenant la méthode addStudent ressemble à ceci:

function addStudent(){
  students.push(document.getElementById("namebox").value, parseInt(document.getElementById("scorebox").value));
alert(students[x] + " added");
x++;
document.getElementById("namebox").value = "".focus();
document.getElementById("scorebox").value = "".focus();
document.getElementById("namebox").focus();
document.getElementById("scorebox").focus();
}

MISE À JOUR n ° 2

Ma dernière mise à jour était uniquement pour addStudent, car je pensais que c'était le problème. Alors maintenant, tout cela doit fonctionner en suivant les étapes ci-dessous:

Sur votre html ajoutez un div avec le résultat id car il semble que vous avez oublié

<div id="result"></div>

Sur votre Javascript, copiez et collez ce qui suit

var x = 0;
var students = [];

    function addStudent(){
      students.push([document.getElementById("namebox").value, parseInt(document.getElementById("scorebox").value)]);
    alert(students[x] + " added");
    x++;
    document.getElementById("namebox").value = "".focus();
    document.getElementById("scorebox").value = "".focus();
    document.getElementById("namebox").focus();
    document.getElementById("scorebox").focus();
    }

    function displayArray(){
    var e = "<hr>";

    for (y = 0; y < students.length; y++)
    {
    e += students[y][0] + "&nbsp;" + students[y][1] + "<br>";
    }
    document.getElementById("result").innerHTML = e;
    }

Notez que j'ai changé un peu la fonction addStudent juste pour ajouter chaque élève comme un tableau séparé composé de son nom et de son score.

1
catchiecop 14 janv. 2017 à 13:42

Faire quelque chose comme ça

function addStudent(){
    var studentArray = [],
        tempArray = [],
        index= 0;

    tempArray[0] = document.getElementById("namebox").value; // David
    tempArray[1] = document.getElementById("scorebox").value; //80

     // this will insert array into main array.
    studentArray.push(tempArray); // [['David', 80]]

    // rest of your code

    return studentArray;
    }
1
MGA 14 janv. 2017 à 12:10