Я использую Node.js для рендеринга файлов EJS. Я хочу, чтобы пользователь заполнил форму журнала и отправил свои данные в базу данных. Начальная часть формы находится в log.ejs, отображается через log.js и является неполной. Когда пользователь выбирает опцию, я хочу, чтобы остальная часть формы отображалась. Я хочу, чтобы каждая опция отображала немного разные формы (т.е. easyForm, longrunForm и т. Д.) И заполняла исходную форму, все еще используя log.ejs. Я попытался сделать это, добавив <%- include('logForms/easyForm.ejs') -%>
после неполной формы в log.ejs, и попытался сделать это несколькими различными способами с атрибутом <select>
elements onclick=""
. Я не придумал функционирующий код, и я не знаю лучшего способа сделать это с форматом EJS. Если я вручную добавлю <%- include('logForms/easyForm.ejs') -%>
после неполной формы в log.ejs, то форма загрузится, и я смогу успешно сохранить данные в своей базе данных. Любая помощь будет оценена.
log.ejs
<%- include('partials/header.ejs') -%>
<!--Form begins but has no closing -->
<form class="" action="/log" method="post">
<div class="form-group">
<label for="">Date</label>
<input type="date" name="workoutDate" class="">
<label for="">Time</label>
<input type="time" name="timeOfDay" placeholder="Time of day hh:mm">
<select class="" id="workoutSelect" name="workoutType" onchange="">
<option disabled selected value>-- select an option --</option>
<option value="run">Run</option>
<option value="longRun">Long run</option>
<option value="shakeout">Shakeout</option>
<option value="workout">Workout</option>
<option value="race">Race</option>
<option value="xTrain">X-Train</option>
</select>
</div>
<!--This is where specific logForm is used to add appropriate fields and close the form -->
<%- include('partials/footer.ejs') -%>
log.js
const express = require('express');
const router = express.Router();
const mongoose = require('mongoose');
const Data = require('../models/data');
router.get('/', (req, res, next) => {
res.render('log');
});
router.post('/', (req, res, next) => {
const data = new Data ({
date: req.body.workoutDate,
timeOfDay: req.body.timeOfDay,
type: req.body.workoutType,
otherData: req.body.otherData,
});
data.save()
.then(results => {
console.log(results);
res.render('log');
})
.catch(err => {
console.log(err);
res.status(500).json({
error: err
});
});
});
module.exports = router;