Генерируйте хорошо отформатированный вывод формы Flask с табуляцией и новыми строками

Question

Я пытаюсь создать веб-приложение, которое будет генерировать шаблонный код для использования в отдельной программе. Я хочу создать хорошо структурированную форму сообщения при отправке, которая включает вкладки и новые строки.

Это текущая итерация кода:

from flask import Flask, render_template
from flask_bootstrap import Bootstrap
from flask_wtf import FlaskForm
from wtforms import StringField, SubmitField
from wtforms.validators import Required

app = Flask(__name__)
# Flask-WTF requires an enryption key - the string can be anything
app.config['SECRET_KEY'] = 'some?bamboozle#string-foobar'
# Flask-Bootstrap requires this line
Bootstrap(app)
# this turns file-serving to static, using Bootstrap files installed in env
# instead of using a CDN
app.config['BOOTSTRAP_SERVE_LOCAL'] = True

# with Flask-WTF, each web form is represented by a class
# "NameForm" can change; "(FlaskForm)" cannot
# see the route for "/" and "index.html" to see how this is used
class NameForm(FlaskForm):
    group_name = StringField('Which is the name of the group label?', validators=[Required()])
    question = StringField('What is the question?', validators=[Required()])
    answer = StringField('What is the answer?', validators=[Required()])
    c1 = StringField('What is the first answer choice?', validators=[Required()])
    c2 = StringField('What is the second answer choice?', validators=[Required()])
    c3 = StringField('What is the third answer choice?', validators=[Required()])
    c4 = StringField('What is the fourth answer choice?', validators=[Required()])

    submit = SubmitField('Submit')

# all Flask routes below

# two decorators using the same function
@app.route('/', methods=['GET', 'POST'])
@app.route('/hello.html', methods=['GET', 'POST'])
def hello():
    # you must tell the variable 'form' what you named the class, above
    # 'form' is the variable name used in this template: index.html
    form = NameForm()
    message = ""
    if form.validate_on_submit():
        message = f"""
            *group: {form.group_name.data}
            \t*program: Progress_Increment
            \t*question: {form.question.data}
            \t\t*shuffle
            \t\t{form.c1.data}
            \t\t{form.c2.data}
            \t\t{form.c3.data}
            \t\t{form.c4.data}
            \t\t*save: {form.group_name.data}_q1
            \t\t-- *countdown: 30.seconds
            \t\t*throwaway
            \t>> {form.group_name.data}_answer = "{form.answer.data}"

            \t*program: Progress_Increment
            \t*question: For the previous question, how confident are you that the answer you selected is reasonably close to the correct answer?
            \t\t*type: slider
            \t\t*before: 0% confident
            \t\t*after: 100% confident
            \t\t*min: 0
            \t\t*max: 100
            \t\t*save: {form.group_name.data}_confidence
            \t\t-- *countdown: 30.seconds
            \t\t*throwaway

            \t*program: Progress_Increment
            \t*question: Is it important to you that your answer is reasonably close to the correct answer? That is, is this a topic where you would care about being wrong or right?
            \t\t*type: slider
            \t\tDon't care at all
            \t\tCare a little
            \t\tCare somewhat
            \t\tCare somewhat strongly
            \t\tCare strongly
            \t\t*before: Don't care at all
            \t\t*after: Care strongly 
            \t\t*save: {form.group_name.data}_importance
            \t\t-- *countdown: 30.seconds
            \t\t*throwaway
            """


    # notice that we don't need to pass name or names to the template
    return render_template('hello.html', form=form, message=message)

# keep this as is
if __name__ == '__main__':
    app.run(debug=True) 

И .html файл выглядит так

{% extends 'bootstrap/base.html' %}
{% import "bootstrap/wtf.html" as wtf %}

{% block styles %}
{{ super() }}
    <link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
{% endblock %}


{% block title %}
Question Submission
{% endblock %}


{% block content %}

<div class="container">
  <div class="row">
    <div class="col-xs-12">

      <h1>Question Generator Page</h1>

      <p class="lead">Please fill out the forms below</p>

      {{ wtf.quick_form(form) }}

      <p class="space-above"><strong>{{ message }}</strong></p>

    </div>
  </div>
</div>

{% endblock %}

Я хочу, чтобы при отправке формы выходные данные сохраняли встроенную табуляцию, встроенную в сообщение. Я предполагаю, что это потребует некоторой обработки в файле .html, но я не уверен, что это можно сделать правильно.

Есть мысли?

Answer 1

Свойство CSS white-space может сохранять пробелы, вкладки и т. Д. В HTML.pre или pre-wrap кажутся подходящими для этой ситуации:

pre

Последовательности пробелов сохраняются.Строки разбиваются только на символах новой строки в источнике и на элементах
.

pre-wrap

Последовательности пробелов сохраняются.Строки разбиваются на символах новой строки, на
и, при необходимости, для заполнения полей.

Оберните содержимое в соответствующий элемент (например, div) и добавьте к нему стиль:

<p class="space-above" style="white-space: pre-wrap"><strong>{{ message }}</strong></p>

Примечание. Атрибут style выполняет работу здесь, но обычно предпочтительны внешние таблицы стилей.