无法使用nodejs POST请求保存表单数据?

时间:2018-02-18 20:34:55

标签: node.js express

我的"设置"允许用户编辑其个人资料的页面。我能够执行GET请求以获取用户详细信息以填充表单。但是,我正在努力采取新的更改并将其保存到用户对象/数据库。我得到的唯一错误是在网页上写着" Not Found" (这可能是我下载的网页设计模板中的一般错误)。我的控制台中没有任何错误。它只是不会将数据保存到数据库以更新用户。

settings.js route:

    var express = require('express');
    var router = express.Router();
    var passport = require('passport');
    var LocalStrategy = require('passport-local').Strategy;
    var User = require('../models/user');

    // GET user
    router.get('/', function(req, res) {

      const vm = req.user;
      res.render('settings', vm);
    });

    // POST changes
    router.post('/', function(req, res) {
      const vm = req.user;
      var name = req.body.name;
      var username = req.body.username;
      var title = req.body.title;
      var password = req.body.password;
      var isCreator = req.body.isCreator;
      var bio = req.body.bio;

      vm.name = name;
      vm.username = username;
      vm.title = title;
      vm.password = password;
      vm.isCreator = isCreator;
      vm.bio = bio;

      vm.save()
        .then(item => {
          res.send("item saved to database");
        })
        .catch(err => {
          res.status(400).send("unable to save to database");
        });
    });

    module.exports = router;

settings.handlebars HTML form at localhost/settings:

    <body class="scroll-assist">
    <div class="main-container">
      {{#if user}}
          <div class="col-md-8 col-md-offset-2 col-sm-10 col-sm-offset-1">
              <div class="feature boxed bg-secondary">
                  <form class="text-center form-email" action="/" method="post" data-error="There were errors, please check all required fields and try again" data-success="Changes saved!">
                      <h4 class="uppercase mt48 mt-xs-0">Settings</h4>
                      <div class="overflow-hidden">
                          <h6 class="uppercase">
                              Profile
                          </h6>
                          <input type="text" name="email" class="col-md-6" value="{{email}}" placeholder="Email"/>
                          <input type="text" name="username" class="col-md-6" value="{{username}}" placeholder="username" />
                          <input type="text" name="title" class="col-md-12" value="{{title}}" placeholder="Title" />
                          <input type="text" name="password" class="col-md-6" value="{{password}}" placeholder="Password"/>
                          <input type="text" name="password2" class="col-md-6" value="{{password}}" placeholder="Confirm Password" />
                          <textarea name="bio" rows="2" value="{{bio}}" placeholder="Tell your followers who you are!"></textarea>
                      </div>
                      <div class="overflow-hidden">
                          <hr>
                          <h6 class="uppercase">
                              Become a Creator? (this will make your profile public)
                          </h6>
                          <div class="col-sm-12">
                              <p class="mb16">
                                  Enable Creator Profile
                              </p>
                              <div class="checkbox-option text-left">
                                  <div class="inner"></div>
                                  {{#if isCreator}}
                                  <input type="checkbox" name="isCreatorTrue" value="isCreatorTrue" checked>
                                  {{else}}
                                  <input type="checkbox" name="isCreatorFalse" value="isCreatorFalse"/>
                                  {{/if}}
                              </div>
                          </div>
                          <hr>
                      </div>
                      <div class="overflow-hidden">
                          <div class="col-sm-6 col-sm-offset-3">
                              <h6 class="uppercase">
                                  How would you describe your work?
                              </h6>
                              <div class="select-option">
                                  <i class="ti-angle-down"></i>
                                  <select name="referrer">
                                      <option selected value="Default">Select An Option</option>
                                      <option value="google">Gaming</option>
                                      <option value="website">Writing</option>
                                      <option value="friend">Music</option>
                                      <option value="friend">Arts and Crafts</option>
                                      <option value="other">Other</option>
                                  </select>
                              </div>
                              <button type="submit">Save Changes</button>
                          </div>
                      </div>
                  </form>
              </div>
              {{/if}}
            </div>
        </section>

1 个答案:

答案 0 :(得分:0)

您已将表单的操作设置为/settings,但后端POST路由绑定到/,因此它们不匹配。

因此,更改表单的操作或绑定路由,以便它们匹配,并且可以执行save方法。

相关问题