Question

这是我的第一个Node应用程序，我正在尝试根据用户应用的过滤器刷新视图。我有一个视图，可以在下表中显示数据

上面的代码是

async function getAll(req, res){
  try {
    if (req.session.loginError == true) {
      return res.redirect('/');
    }

    //** logic to fetch data in sData[]

    return res.view('pages/list', {data:sData});
  }
  catch(error){
    sails.log.error('Controller#getAll :: error :', error);
    return res.badRequest('Cannot fetch data at this time.' + error.stack);

  }
}

以上工作正常。问题是，如果我们选择某些日期过滤器（例如fromDate和toDate），则可以正确提取来自后端的数据，但不会刷新视图。我在ejs页面中放置了以下代码，以将过滤器发送到控制器：

function search()
{
    var searchData = {
        fromDate : document.querySelector('#fromDate').value,
        toDate : document.querySelector('#toDate').value,
        status : document.querySelector('#status').value
    };

    var xmlhttp=new XMLHttpRequest();
    url = "/admin/controller/filterData";
    xmlhttp.open("POST",url,true);
    xmlhttp.setRequestHeader('Content-Type', 'application/json;charset=UTF-8')
    xmlhttp.send(JSON.stringify(searchData))

}

如下所示在控制器中创建了一个名为filterData的新方法

async function filterData(req, res) {    
try {
        if (req.session.loginError == true) {
          return res.redirect('/');
        }

        var sDate = Date.parse(req.param('fromDate'));
        var eDate = Date.parse(req.param('toDate'));
        var sta = req.param('status')
        var data= await ****.find().where({ and: [{ start_date: { '>': sDate, '<': eDate } }, { status: sta }] }).populate("***").sort('createdAt DESC');
        let sData = [];

        _.forEach(d, function(data){

         //logic to format data

          sData.push(d);
        });


        return res.view('pages/list', {data:sData});
      }
      catch (error) {
        sails.log.error('Controller#getfilterData :: error : ', error);
        return res.redirect('/admin/***/getAll');
      }
}

sData []获得过滤的记录，但是页面没有被新数据刷新。我不确定是否可以像这样刷新视图，还是需要将过滤后的数据发送回视图中的函数，然后必须从那里刷新表。请告知。

Answer 1

您正在发送XMLHttpRequest，这是一个ajax的电话。因此该页面根本不会重新加载。最好从服务器返回/admin/controller/filterData请求的json响应，然后用ajax响应填充UI。

SailsJs-使用新数据刷新视图

1 个答案: