Question

我正在尝试完成以下函数，该函数通过AJAX将值发送到后端作为查询的参数，该查询将在用户屏幕上输出报告结果而不重新加载。

如果我只使用一个参数（datereport：'2017-06-21'）它可以正常，我会在同一页面上获得结果而无需重新加载。

查看网址为localhost/reports

然而，当我尝试使用像currencyreport这样的第二个值时，直到AJAX函数和后端才会得到它。

EJS

<input id="datereport" class="form-control" name="datereport" value="2017-06-21">
<input id="currencyreport" class="form-control" name="currencyreport" value="GBP">

<input type="button" value="Search" class="btn btn-info mr-1" onClick="searchReport([document.getElementById('datereport').value,document.getElementById('currencyreport').value])">

用于向/从后端发送和获取值的AJAX函数

function searchReport(datereport, currencyreport) {

    console.log(datereport) // it outputs both datereport,currencyreport values instead of the first one only  ["2017-06-21","GBP"]
    console.log(currencyreport) // it outputs undefined
    $.ajax({
        url: "/reports",
        type: "get",
        data: $("#report-form").serialize(),
        success: function(res) {
            $.post("/reportsdate/" + data, function(data) {
                // it builds GET /reports?datereport=2017-06-21&currencyreport=GBP
                ok(data);
            });
            return false;
        },
        error: function(xhr, status, error) {
            // error stuff
        }
    });
}

// The part which takes the backend results and output in the same page without reloading

function ok(datares) {
    document.getElementById("results").innerHTML = Object.values(datares.data[0])
}

后端

var express = require('express');
var router = express.Router();
var bodyParser = require('body-parser');
var url = require('url');

router.use(bodyParser.urlencoded({ extended: true }));
router.use(function(req, res, next) {
    console.log(req.method, req.url);
    next();
});


var reports = router.route('/reports');
var reportsdate = router.route('/reportsdate');

router.get('/reportsdate', function(req, res) {
    res.render('reports');
});

router.get('/reports', function(req, res) {
    res.render('reports');
});

reportsdate.post(function(req, res, next) {

    datereport = req.query.datereport;
    currencyreport = req.query.currencyreport;

    req.getConnection(function(err, conn) {

        if (err) return next("Cannot Connect");

        var queryString = "SELECT SUM(total_profit) AS fee_total FROM transactions WHERE date_created = ?";
        var queryParams = [];
        queryParams.push(datereport);

        if(currencyreport){
              queryString += ' AND currency = ? ';
              queryParams.push(currencyreport);
        }

        var query = conn.query(queryString, queryParams,  function(err, rows) {
            if (err) {
                console.log(err);
                return next(err);
            }
            var ab = {data: rows};
            console.log('hohohoho ' + JSON.stringify(ab));
            res.send(ab)

        });
    });
});

router.get('/reports', function(req, res) {
    res.render('reports', {data: ab});
});

Answer 1

您正在使用：

的onClick =＆＃34; searchReport（[的document.getElementById（＆＃39; datereport＆＃39;）值，的document.getElementById（＆＃39; currencyreport＆＃39;）值。]）＆＃34;＆GT ;

这意味着您使用数组调用searchReport。但是你的函数只需要变量。

因此，如果你删除大括号，一切都应该有效。

onClick="searchReport(document.getElementById('datereport').value,document.getElementById('currencyreport').value)">

Node.js - 如何通过AJAX传递多个MySQL查询参数

1 个答案: