表单提交问题：无法读取表单提交时未定义的属性答案

【问题标题】：Form submit issue: Cannot read property of undefined on form submit表单提交问题：无法读取表单提交时未定义的属性
【发布时间】：2017-03-19 10:43:33
【问题描述】：

我是 keystonejs 的新手（使用最新的 4）。基于demo app contact form code，我创建了一个表格来添加2个日期。我的问题是，在提交表单时，我收到一个 500 错误“无法读取未定义的属性 'bookedFrom'”......你能帮我找到这个吗？谢谢！

我的代码是：

模板/视图/booking.jade

extends ../layouts/default

block content
    form(method='post').form-horizontal
        input(type='hidden', name='action', value='booking.create')
        .form-group
            label.col-sm-2.text-left.control-label From
            .col-sm-10
                input(type='date' name='bookedFrom' value=formData.bookedFrom required placeholder="2018-01-01").form-control
        .form-group
            label.col-sm-2.control-label To
            .col-sm-10
                input(type='date' name='bookedTo' value=formData.bookedTo required placeholder="2018-12-31").form-control
        .form-group
        button(type='submit').btn.btn-primary Book

路线/视图/booking.js

var keystone = require('keystone');
var Booking = keystone.list('Booking');

exports = module.exports = function (req, res) {

    var view = new keystone.View(req, res);
    var locals = res.locals;

    // Set locals
    locals.section = 'booking';
    locals.formData = req.body || {};
    locals.validationErrors = {};
    locals.bookingSubmitted = false;

    view.on('post', { action: 'booking.create' }, function (next) {

        var newBooking = new Booking.model({
            bookedFrom: locals.FormData.bookedFrom,
            bookedTo: locals.FormData.bookedTo
        });
        var updater = newBooking.getUpdateHandler(req);

        updater.process(req.body, {
            fields: 'bookedFrom, bookedTo',
            flashErrors: true
        }, function (err,res) {
            if (err) {
                locals.validationErrors = err.errors;
            } else {
                locals.bookingSubmitted = true;
            }
            next();
        });
    });

    // Render the view
    view.render('booking');

};

模型/Booking.js

var keystone = require('keystone');
var Types = keystone.Field.Types;

var Booking = new keystone.List('Booking', { track: true });

/**
* Booking Model
* =============
*/

Booking.add({
    bookedFrom: { type: Types.Date, index: true },
    bookedTo: { type: Types.Date, index: true },
});

Booking.track = true;
Booking.defaultSort = '-createdAt';
Booking.defaultColumns = 'createdBy, bookedFrom, bookedTo';
Booking.register();

路由/index.js

var keystone = require('keystone');
var middleware = require('./middleware');
var importRoutes = keystone.importer(__dirname);

// Common Middleware
keystone.pre('routes', middleware.initLocals);
keystone.pre('render', middleware.flashMessages);

// Import Route Controllers
var routes = {
    views: importRoutes('./views'),
};

// Setup Route Bindings
exports = module.exports = function (app) {
    // Views
    app.get('/', routes.views.index);
    app.all('/booking', middleware.requireUser, routes.views.booking);
};

【问题讨论】：

标签： keystonejs

【解决方案1】：

你的变量名有错别字。您实例化了locals.formData 变量，但稍后将其称为locals.FormData。后一个变量未定义，导致您的 500 错误。重命名模型创建中引用的变量。

var newBooking = new Booking.model({
    bookedFrom: locals.formData.bookedFrom,
    bookedTo: locals.formData.bookedTo
});

【讨论】：