How to add database table values into a javascript table?

Question

so that's my question.

I have a database called Storage with a table named products, that table has 20 rows of products with the following fields (name, description, price, quantity).

in my javascript code, i'm using XMLHttpRequest to ask the server for this information, the server (java servlet) executes the query "SELECT * FROM products" to get all values and save them in a variable in server side

my question goes, how can i get that data from the java servlet, send it to my javascript code (client side) and create a table with those values.

this is my attempt to generate the table in client side to add the values.

`function generateTable()
{
    table.style.border = "1";
    table.style.borderColor = "red";
    table.style.alignment = "center";

    for (int i=0; i<10; i++)
    {
        table.insertRow();

        for(int j = 0; j<4; j++)
        {
            table.rows[i].insertCell();
        }
    }

    table.style.display = "block";
    document.body.appendChild(table);
}`

Notes: i have to use raw Javascript, Java, and if needed AngularJS.

Answer 1

If you mean insert a row to the table, and you want to use AJAX way. AJAX is when you do not refresh the page, only JavaScript communicates in the background.

1. post an AJAX message to a servlet
2. implement the doPost() method and return a Stirng value, it could be a JSON
3. implement the Javascript callback where the AJAX completed