Javascript - array problems

Question

For my school project i am trying to get a users data and then display them in a table.
My code is :
Javascript

    var array =Array();//fname
    var array1 =Array(); //lname 

function a(){
    let fname = document.getElementById("Fname").value;
    let lname = document.getElementById("Lname").value;

    array.push(''+fname);
    array1.push(''+lname);}

function moriodotisi() {
    var ttable = $('#t01');
    ttable.empty();
    ttable.append('' +
        '<tr>' +
        '<th>Name</th>' +
        '<th>LastName</th>' +
        '</tr>'
    );
    for (var y = 0; y < array.length; y++) {
        ttable.append(''+
        '<tr>' +
        '<th>'+array[y]+'</th>' +
        '<th>'+array1[y]+'</th>' +
        '</tr>'
        );
    }
}

I think this supposed to look like
Name LastName
MyName MyLastName

But it is like
Name LastName
M M
y y
N L
a a
m s
e t
..... etc

Also i am using the same array in a different function ant it works and displays the whole word not letter by letter...
the other function is :

function display_array() {
    var cards_container = $('#cards-container');
    cards_container.empty();
    for (var y = 0; y < array.length; y++) {
        cards_container.append('' +
            '<div class="table-responsive">' +

            '<table class="table">' +
            '   <thead>' +
            '     <tr>' +
            '       <th>Firstname</th>' +
            '       <th>Lastname</th>' 
            '     </tr>' +
            '   </thead>' +
            '   <tbody>' +
            '     <tr>' +
            '       <td >' + array[y] + '</td>' +
            '       <td>' + array1[y] + '</td>' 
            '     </tr>' +
            '   </tbody>' +
            ' </table>' +
            '</div>'
        );
    }
}

Answer 1

The main issue you're facing is that the variables array and array1 are of type 'string' and are not arrays. The reason why you're not getting an error is that within strings, you can also use the index to access a character. So with the code string const text = 'hello', then accessing the elements as if it's an array, such as text[1] //'e' will produce the character in that spot.

As to your code, I cannot see where the variables array and array1 are redefined to be a string, but there are a number of ways those variables may become a string between the time you defined them (or when a is called) to when the function moriodotisi is called. I suspect you have somewhere some code that looks like this array = document.getElementById("Fname").value.

To advice on where specifically your bug is, I'd need to see more code, but from what I've said above, it should be enough to track down the issue. I'd recommend placing some console.log('') calls to follow array as you run the script.