2

我想 在我的网站中使用引导程序所见即所得。Flask我找到了这个项目flask-wysiwyg并按照作者的建议，但它不起作用。

我想知道：

  • 怎么了？
  • 我应该如何自己解决这个问题？

这是代码：

表格.py

from .wysiwyg import WysiwygField

class PostForm(Form):
    article_title = StringField(u'title', validators=[Required(), Length(1, 64)])
    body = WysiwygField(u"txteditor", validators=[Required()])
    submit = SubmitField(u'submit')

视图.py

# views.py
from .forms import PostForm
@main.route('/post', methods=['GET', 'POST'])
@login_required
def post():
    title = u'edit'
    form = PostForm()
    if  form.validate_on_submit():
        posts = Post(article_title=form.article_title.data,
                     body=form.body.data,
                     author=current_user._get_current_object())
        db.session.add(posts)
        flash(u'commit')
        return redirect(url_for('.doc'))
    return render_template('post-rich-text-edit.html', title=title, form=form)

后富文本-edit.html

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

{% block head %}
{{ super() }}
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='prettify.css') }}">
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='font-awesome.css') }}">


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
{% endblock %}

{% block page_content %}
<div class="page-header">
    <div class="row">
        <div class="col-md-12">
            <form method=post action="/">
            {{ form.article_title }}
                {{ form.hidden_tag() }}
                {{ form.body.label }}
                <div id="editor">
                {{ form.body(size=20) }}

                </div>
            {{ form.submit }}
            </form>
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
{{ super() }}
    <script  type="text/javascript" src="{{ url_for('static', filename='bootstrap-wysiwyg.js') }}"></script>
    <script  type="text/javascript" src="{{ url_for('static', filename='jquery.hotkeys.js') }}"></script>
    <script  type="text/javascript" src="{{ url_for('static', filename='prettify.js') }}"></script>
{% endblock %}
4

3 回答 3

2

目前还不是很清楚你面临的问题是什么。但是，您有一点认为flask-wysiwyg软件包的文档可能具有误导性。

要使用WysiwygField，请将您的import statementin更改forms.py为：

from flask_wysiwyg.wysiwyg import WysiwygField
于 2016-03-04T14:44:39.793 回答
1

添加WysiwygField到forms.py

from flask_wysiwyg.wysiwyg import WysiwygField

并添加block scripts到post-rich-text-edit.html

<script>
    $('#editor').wysiwyg();
</script>
于 2017-09-27T09:44:52.020 回答
0

将最后 3 行scripts block移入head block

于 2016-03-05T00:25:47.337 回答