Как привязать Node-js DB к веб-форме

Question

Я использую node и postgres, я новичок в написании асинхронной функции, я пытаюсь сделать очень простой запрос, который сделает общее количество записей в базе данных, добавит одну к нему и вернетрезультат.Результат будет виден до генерации DOM.Я не знаю, как это сделать, поскольку асинхронная функция не возвращает значение вызывающим (также, вероятно, у меня все еще есть синхронное мышление).Вот функция:

function generateRTA(callback){
var current_year = new Date().getFullYear();
const qry = `SELECT COUNT(date_part('year', updated_on)) 
              FROM recruitment_process
              WHERE date_part('year', updated_on) = $1;` 
const value = [current_year]

pool.query(qry, value, (err, res) => {
    if (err) {
      console.log(err.stack)
    } else {
        var count = parseInt(res.rows[0].count) + 1
        var rta_no = String(current_year) + '-' + count
        callback(null, rta_no)        
    }
  })
}

Для внешнего интерфейса я использую мопса с простой формой HTML.

const rta_no = generateRTA(function (err, res){
if(err){
    console.log(err)
}
else{
    console.log(res)
}
})


app.get('/new_application', function(req, res){
res.render('new_application', {rta_number: rta_no})
});

Я вижу rta_no в console.log, но как мне передать его обратно в DOM, когда значение будет готово?

Answer 1

Основываясь на асинхронном ответе на вызов ajax, он обновит идентификатор div "div1", когда получит ответ от узла js.

app.js

app.get("/webform", (req, res) => {
    res.render("webform", {
        title: "Render Web Form"
    });
});


app.get("/new_application", (req, res) => {
    // Connect to database.
    var connection = getMySQLConnection();
    connection.connect();
    // Do the query to get data.
    connection.query('SELECT count(1) as cnt FROM test ', function(err, rows, fields) {
    var person;
    if (err) {
        res.status(500).json({"status_code": 500,"status_message": "internal server error"});
    } else {
        // Check if the result is found or not
        if(rows.length==1) {
            res.status(200).json({"count": rows[0].cnt});
        } else {
            // render not found page
            res.status(404).json({"status_code":404, "status_message": "Not found"});
        }
    }
});
// Close connection
connection.end();
});

webform.pug - через асинхронный вызов

html
  head
    script(src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js')
    script.
        $(document).ready(function(){
        $.ajax({url: "/new_application", success: function(result){
        $("#div1").html(result.count);
        }});
        });
  body
    div
       Total count goes here  : 
    #div1
       value loading ...

Answer 2

Это кажется нормальным, я просто не уверен в этом:

Результат будет виден до генерации DOM

Это ограничение побеждает цельasync, так как ваш DOM должен ждать возвращаемого значения, чтобы быть там.Вместо того, чтобы ждать его, вы можете просто отобразить страницу, и как только функция вернется и запустит ваш обратный вызов, обновите значение.

Кроме того, возможно, стоит взглянуть на обещания