使用 node.js/express 将数据保存到 mysql 而不刷新页面

Question

I am learning node.js and I have managed to save data into mysql with form submit. The code looks like this:

    app.post('/auth', function(request, response) { 
    let date = request.body.date;
    let user = request.body.user;
    let email = request.body.email;
    connection.connect(function(err) {
                if (err) throw err;
                console.log("Connected!");
                var sql = "INSERT INTO demotable (date, user, email) VALUES (?,?,?)"; 
                connection.query(sql, [date, user, email], function (err, result) {
                  response.end(); 
                });
              });
});

This works and the data is added to the table, but because I use input submit it takes me to a new page (/auth) afterwards. I need to update the database without updating or refreshing the whole page, meaning I cant use submit form. What is the best way to accomplish this instead?

Answer 1

I accomplished this by using an AJAX POST request on the client's side. Instead of having your button submit a form, have it perform a function with the onclick attribute. You can grab the values of each input with their IDs. As for the server side route, just use res.send() or whatever you'd like to send a simple response. In the function below, the response received is extremely simple. On your route, if the auth fails just do something like res.send({"status": "failed"}) and the AJAX call will receive that, see that (response callback).status is failed and alert the user, same with if the auth is successful (just changed failed to success in the res.send() call). Hope this helped!

function authenticate() {
    $.ajax({
        type: "POST",
        url: "/auth",
        data: {
            "date": Date.now(),
            "user": document.getElementById('usernameInput').value,
            "email": document.getElementById('emailInput').value
        },
        success: function(data) {
            if(data.status == "success") {
                alert("successfully authenticated!")
            } else if(data.status == "failed") {
                alert("failed authentication!")
            }
        }
    });
}

Answer 2

I used the code provided by bobmartin1234. On the server side I wrote the following code:

app.post('/auth', function(request, response) { 
let user = request.body.user 
let email = request.body.email;
let date = new Date(); //I added the date on the serverside instead

connection.connect(function(err) {
    if (err) throw err;
    console.log("Connected!");
    var sql = "INSERT INTO demotable (date, user, email) VALUES (?,?,?)"; 
    connection.query(sql, [date, user, email], function (err, result) { 
      if (err) throw err;
      console.log("1 record inserted");
    });
  });
});