首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >NodeJS通过AJAX调用呈现视图

NodeJS通过AJAX调用呈现视图
EN

Stack Overflow用户
提问于 2019-06-19 03:23:29
回答 2查看 364关注 0票数 0

我尝试使用AJAX调用呈现视图:

let data = {}
data.ph_user = ph_user 
data.nav_destination ='bids_review'
   $.ajax({
    type: 'POST',
    data: JSON.stringify(data),
    contentType: 'application/json',
    url: '/users/navigation',

});

路由器的代码为:

router.post('/navigation', (req, res) => {
 try {
  var fname = req.body['ph_user']
  var main_block = req.body['nav_destination']
    if(main_block='bids_review'){
     console.log(fname, main_block, 'zzzz')
     res.render('bids_review', {ph_user: fname, main_block: 'dashboard'});
    } 
   }catch(err){
     console.log(err)
  }  
 })

看起来路由被正确调用了,但是新的视图没有被渲染。无论是在服务器端还是客户端,我都没有得到任何错误。我知道我可以通过表单来完成,但我想知道是否有一种方法可以通过AJAX调用来实现这一点。任何指导都是非常感谢的。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-06-19 03:31:00

您的路由将呈现的HTML返回给AJAX调用。如果你想直接从服务器上呈现HTML,不要使用AJAX,只需重定向到路由(即使用表单发布数据,或者将路由更改为.get并重定向到该位置)。

要继续使用AJAX,您可能希望从路由返回JSON,并在客户机上呈现它。

票数 2
EN

Stack Overflow用户

发布于 2021-06-04 00:09:16

我也有同样的问题。我做了一个Ajax调用来修改数据。更新后,必须再次显示部分页面,但现在显示了数据已更新的信息。代码只是示例代码,但最重要的部分是在response中,response.body是一个流。如果您将其流式传输到部分(innerHTML),那么将使用res.render数据更新您的页面。额外注意:您可以将该代码放在一个单独的函数中,然后您也可以使用带有分词的PUG :-)

// get form data, save history and post data to database
await this.serializeForm(form)
  .then(data => 
    this.replaceState(form.action).then( () => 
      fetch(form.action, { 
        method: "POST", 
        headers: { 'x-requested-with': 'XMLHttpRequest',
          "Content-Type": "application/json" },            
        body: JSON.stringify(data) 
      }).then( (response) => 
          response
            .body
            .getReader()
            .read()
            .then( ({value}) => {
              let html = new TextDecoder('utf-8').decode(value);              
              this.partialPage.innerHTML = html;
            })
      )));
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/56655754

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档