Разбор данных из пользовательского ввода ввода в форме HTML с использованием Express, маршрутов и Jade - PullRequest
0 голосов
/ 14 января 2020

Я использую Jade и Express для размещения файла html, который имеет четыре ввода текста по обе стороны от начального предложения. Цель состоит в том, чтобы создать многострочное веб-приложение для раскадровки, чтобы пользователь мог вводить новые предложения, которые следуют после root (среднего) предложения, а затем вновь введенные предложения становятся root предложениями следующего экрана ... и так далее. (См. Рисунок ниже)

Screenshot of hosted page

У меня есть маршрут запроса POST, но у меня возникают проблемы при получении ввода пользователя из поля ввода текста и последующем прикреплении его к шаблон Jade.

Jade:

form(action='/', method='post')
                            label(for='top') Enter sentence:
                            input#top(type='text', name='name_field', value= value)
                            input(type='submit', value='OK')

Javascript маршрутизация:

app.post('/', function (req, res){
  res.render('index', { value: 'Hey', message: 'Hello there!' })
});

Как указано выше ^^. Как правильно разобрать пользовательский ввод для использования в шаблоне Jade? (Полный код см. Ниже).

const express = require('express');
const app = express();
const path = require('path');

const bodyParser = require('body-parser')






app.set('views', './views');
app.set('view engine', 'jade');

app.get('/', function (req, res) {
  res.render('index')
});

app.post('/', function (req, res){
  res.render('index', { value: 'Hey', message: 'Hello there!' })
});

app.listen(8081);
module.exports = app;
doctype html
html
style.
	body {
		background: rgba(244, 244, 244, 0.98);
		font-family: Verdana;
		color: #000000;
		padding: 30px;
	}

	th, td {
		border: 3px solid black;
		padding: 30px;
	}

table
			tbody
				tr
					th
					th
						form(action='/', method='post')
							label(for='top') Enter sentence:
							input#top(type='text', name='name_field', value= value)
							input(type='submit', value='OK')
					th
				tr
					th
						form(action='/', method='post')
							label(for='left') Enter sentence:
							input#left(type='text', name='name_field', value='Left')
							input(type='submit', value='OK')
					th  The mouse awoke one day to a mesmerising sound being produced from below.
					th
						form(action='/', method='post')
							label(for='right') Enter sentence:
							input#right(type='text', name='name_field', value='Right')
							input(type='submit', value='OK')
				tr
					th
					th
						form(action='/', method='post')
							label(for='bottom') Enter sentence:
							input#bottom(type='text', name='name_field', value='Bottom.')
							input(type='submit', value='OK')
					th
...