无法从 ejs 获取数据到控制器和客户端 JS答案

【问题标题】：unable to fetch data from ejs to controller and client side JS无法从 ejs 获取数据到控制器和客户端 JS
【发布时间】：2017-11-06 15:16:31
【问题描述】：

我是 node 和 express 的新手。我正在开发一个具有登录模块的应用程序。我可以注册用户，但在尝试登录用户时遇到了一些问题。

请在下面找到我的代码并提出建议：

登录控制器.js

app.post('/testAction',urlencodedParser,function(req,res){

    var usrnm = req.body.username;
    console.log(" usrnm ::: " + usrnm);
    var passwd = req.body.password;
    console.log(" passwd ::: " + passwd);
    Users.findOne({username:"tstusr1"},function(err,data){ // Users is my schema name
        if(err) throw err;
        console.log(" back from ajax with data in login controller :::; " + data);
        res.json(data);
    });
    console.log("inside index2 post");
});

我的 Login-user.js 是

$(document).ready(function(){

      var items = $('form');
      var user ={username: $('[name=username]', items).val()};     
      console.log('user  ' + JSON.stringify(user));

  $('form').on('submit', function(){
      console.log("inside submit login");
      $.ajax({
          type: 'POST',
          url: '/testAction',
          data: user,
          success: function(data, textStatus, jqXHR){
            var resp = JSON.parse(JSON.stringify(jqXHR));
            if(resp["status"]==200){
                console.log("status == 200");
                window.location.href = '/';
            }  
              return data;
          },
          error:function (jqXHR, textStatus, errorThrown) {

              console.log('error  ' + JSON.stringify(user));
              console.log("resp1 :::::: " + JSON.stringify(jqXHR));
              var resp = JSON.parse(JSON.stringify(jqXHR));
              console.log("resp :::::: " + resp);
          }
        });
         return false;
  });  
});

我的 ejs 文件是

<form action="/testAction">
    <label for="username"> Username </label>
    <input type="text" for="username" name="username" />
    <label for="password"> Password </label>
    <input type="password" for="password" name="password" />
    <button type="submit">Log In</button> 
</form>

我的问题是我无法将用户名和密码的值获取到客户端 js 以及后端服务器端 js。

请帮忙

【问题讨论】：

您是否在任何时候遇到错误？您可能还希望在表单处理程序中使用event.preventDefault()。你还在更新user吗？
目前还没有这样的要求，不过谢谢建议，会继续关注的
您的问题不够清楚。您收到错误消息吗？你是什么意思“无法获取值......客户端......以及......服务器”？这些值已经在客户端上。您是否更正了我在下面的答案中发布的问题？你甚至没有发送最新的用户名，页面加载时只有空值。

标签： jquery node.js express mongoose ejs

【解决方案1】：

从发布的代码来看，您似乎根本没有更新用户。您实际上也没有在请求的数据参数中包含密码。

$('form').on('submit', function(e) {
  e.preventDefault();
  $.post('/testAction', {
    username: $('[name=username]', $(this)).val(),
    password: ...
  });
});

如果您想要一种更简单的方式来传递表单中的所有字段：

$('form').on('submit', function(e) {
  e.preventDefault();
  $.post('/testAction', (
    $(this).serializeArray().reduce((o, i) => {
      o[i.name] = i.value;
      return o;
    }, {})
  ));
});

见How can I get form data with JavaScript/jQuery?

【讨论】：

很抱歉，但没有帮助
@SaurabhJhunjhunwala 什么没有帮助？你还没有说你得到了什么错误。我发布的是针对您的代码存在的两个关键问题的解决方案。
我仍然没有得到价值

【解决方案2】：

找到解决方案：

登录控制器.js

app.post('/testAction',urlencodedParser,function(req,res){

    var reqData = JSON.parse(JSON.stringify(req.body));
    console.log(" reqData username :::::::: " + reqData['username']);

    console.log(" reqData password :::::::: " + reqData['password']);

    Users.findOne({username:reqData['username']},function(err,data){
        if(err) throw err;
        console.log(" back from ajax with data in login controller :::; " + data);
        res.json(data);     
});

登录用户.js

$(document).ready(function(){   

  $('form').on('submit', function(){
      console.log("inside submit login");

      var items = $('form');
      var user ={
              username: $('[name=username]', items).val(),
              password: $('[name=password]', items).val()
           }; 

      $.ajax({
          type: 'POST',
          url: '/testAction',
          data: user,
          success: function(data, textStatus, jqXHR){
            var resp = JSON.parse(JSON.stringify(jqXHR));
            console.log(" resp :::::: " + resp);
            if(resp["status"]==200){
                console.log("status == 200");
                var respData =JSON.parse(JSON.stringify(data));
                var enteredPassword = JSON.parse(JSON.stringify(user));
                console.log(" respData password :::::: " + respData.password);
                console.log(" enteredPassword password :::::: " + enteredPassword.password);

                if(enteredPassword.password==respData.password){
                    console.log("success Matched");
                }else {
                    console.log("unsuccessful not-Matched");
                }

            }  
              return data;
          },
          error:function (jqXHR, textStatus, errorThrown) {

              console.log('error  ' + JSON.stringify(user));
              console.log("resp1 :::::: " + JSON.stringify(jqXHR));
              var resp = JSON.parse(JSON.stringify(jqXHR));
              console.log("resp :::::: " + resp);
          }
        });
         return false;
  });  
});

ejs 文件：

<form action="/testAction">
    <label for="username"> Username </label>
    <input type="text" for="username" name="username"/>
    <label for="password"> Password </label>
    <input type="password" for="password" name="password" />

    <button type="submit">Log In</button> 
</form>

【讨论】：