在nodejs和jquery中快速添加、编辑和删除api帖子，无需页面加载

我正在为我的风扇计算软件创建一个CRUD应用程序，每当我需要在查询成功状态下执行重新加载过程时，在node js中插入、更新和删除查询。如何在不加载页面的情况下获得提示和快速数据输入。我在选择菜单选项列表和表行中添加数据并返回。 请参考我编写的代码，并帮助/指导我获得更好的解决方案，以便使用jquery ajax和nodejs执行快速添加-编辑-删除过程

数据库使用sqlite3

代码

前端

$('#addnewmodelform').on('submit', function (event) {
    event.stopPropagation();
    event.preventDefault();
    var Series_ID = $('#Unit_Series option:selected').val();
    var Model_Name = $('#Unit_Series option:selected').text()+'-'+$('#Model_Name').val();
    if($('#Four_Pipe').attr('checked', true)){
        var Four_Pipe = 'TRUE';} else {var Four_Pipe = 'FALSE'}
    var Variant = $("input[name='Variant']:checked").val();
    $.ajax({
        url: "http://localhost:3000/addmodel",
        method: "POST",
        dataType : 'json',
        data:  {
            Series_ID : Series_ID,
            Model_Name : Model_Name,
            Four_Pipe : Four_Pipe,
            Variant : Variant
        },
        success: function (data) {
            console.log(data)
            location.reload();
        }
    })
})

后端

app.post('/addmodel', function  (req, res) {
if (req.body.Series_Pipe == 2){
    var twopipe = 'TRUE'
} else {var twopipe = 'FALSE'}
if (req.body.Series_Pipe == 4){
    var fourpipe = 'TRUE'
} else {var fourpipe = 'FALSE'}

    var query = 'INSERT INTO "Unit_Models"("Series_ID","Model_Name","m4Pipe","Dim_Image_file","Filter_Default","Coil_Default","Model_Number","Variant") VALUES ('
    query += "'" + req.body.Series_ID + "',"
    query += "'" + req.body.Model_Name + "',"
    query += "'" + req.body.Four_Pipe + "',"
    query += "'" + 'x'+ "',"
    query += "'" + '1'+ "',"
    query += "'" + '1'+ "',"
    query += "'" + req.body.Model_Name + "',"
    query += "'" + req.body.Variant + "'"
    query +=  ");"
    // query +='INSERT INTO "Unit_Models"("Series_ID") VALUES ('
    db.run(query, (err, results) =>{
        if(err) throw err;
        res.redirect('http://localhost:3000/')
    }) 
});

---

在后端代码中，您尝试将hole页面发送到jQueryAjax函数 尝试只从代码中发送要更新的数据，然后可以根据需要更新ui页面

index.js

app.post('/addmodel', function (req, res) {
    if (req.body.Series_Pipe == 2) {
        var twopipe = 'TRUE'
    } else {
        var twopipe = 'FALSE'
    }
    if (req.body.Series_Pipe == 4) {
        var fourpipe = 'TRUE'
    } else {
        var fourpipe = 'FALSE'
    }

    var query = 'INSERT INTO "Unit_Models"("Series_ID","Model_Name","m4Pipe","Dim_Image_file","Filter_Default","Coil_Default","Model_Number","Variant") VALUES (?,?,?,?,?,?,?,?)'

    db.run(query, [req.body.Series_ID, req.body.Model_Name, req.body.Four_Pipe, 'x', '1', '1', req.body.Model_Name, req.body.Variant], (err, results) => {
        if (err) {
            console.log(err.message)
            res.send(err.message)
            return
        }

        console.log(`A row has been inserted with rowid ${this.lastID}`);
        // set your query 
        const sql = `SELECT  * FROM Unit_Models where ROWID=? `;

        db.all(sql, [this.lastID], (err, data) => {
            if (err) {
                throw err;
            }
            console.log(data)
            res.send(data);
        });
    })
    // close connection
    db.close((err) => {
        if (err) {
            console.error(err.message);
        }
        console.log('Close the database connection.');
    });
});

jquery函数

   $('#addnewmodelform').on('submit', function (event) {
        event.stopPropagation();
        event.preventDefault();
        var Series_ID = $('#Unit_Series option:selected').val();
        var Model_Name = $('#Unit_Series option:selected').text()+'-'+$('#Model_Name').val();
        if($('#Four_Pipe').attr('checked', true)){
            var Four_Pipe = 'TRUE';} else {var Four_Pipe = 'FALSE'}
        var Variant = $("input[name='Variant']:checked").val();
        $.ajax({
            url: "http://localhost:3000/addmodel",
            method: "POST",
            dataType : 'json',
            data:  {
                Series_ID : Series_ID,
                Model_Name : Model_Name,
                Four_Pipe : Four_Pipe,
                Variant : Variant
            },
            success: function (data) {
                console.log(data)
                //here you can update your UI elements as you want 
            }
        })
    })

---

谢谢@petranb2。但我尝试了即使日志（数据）也不会抛出结果数据。我尝试了以下代码

success:function（data）{console.log（data）alert（data）$Unit_Models.append（$（“”）val（data.Model_ID.html（data.Model_Name））；$（'.bg modal add Model'）.fadeOut（“slow”）document.querySelector（'.bg modal add Model'））.style.display='none'；}

我只是在后端代码中添加了console.log（results），以便查看数据集的格式。我想这是一个数组，您必须在前端迭代它们。您可以使用数据集更新您的帖子，以帮助您迭代数据。在insert查询之后，如果登录为“undefined”，我不知道结果输出是什么类型的，因为insert语句在回调函数中不返回任何数据。如果要从数据库中获取新行，必须再次查询并将其发送给Browser，然后才能获取最后插入的数据。。类似于从表中选择*，其中rowid=last\u insert\u rowid（）