django ckeditor将不会显示在表单上

时间:2018-10-28 03:47:03

标签: python-3.x django-forms ckeditor5

遵循https://django-ckeditor.readthedocs.io/en/latest/中提到的每个步骤,但是当我查看表单时,没有任何编辑器。我也确实运行了“ python manage.py collectstatic”

settings.py特定于ckeditor。

INSTALLED_APPS = [
    'ckeditor',
    'ckeditor_uploader',
]

STATIC_URL = '/static/'    
STATIC_ROOT = os.path.join(BASE_DIR,"static")
CKEDITOR_BASEPATH = STATIC_ROOT+"/ckeditor/ckeditor"

CKEDITOR_UPLOAD_PATH = "ck_uploads/"
CKEDITOR_IMAGE_BACKEND = "pillow"

MEDIA_URL = STATIC_URL+'media/'

MEDIA_ROOT = os.path.join(STATIC_ROOT,'media')

urls.py

url(r'^ckeditor/', include('ckeditor_uploader.urls')),

forms.py

from ckeditor.widgets import CKEditorWidget

class BlogPostForm(forms.ModelForm):
    class Meta():
        model = BlogPost
        fields = ('title','brief','content','accept_comments','is_public')

        brief = forms.CharField(widget=CKEditorWidget())
        content = forms.CharField(widget=CKEditorWidget())

到目前为止,尚无建议(包括将小部件定义移出Meta)。

我是自定义呈现表单的方法,这就是在表单中呈现字段的方式。

{{ form.details }}

使用{{ form.as_p }}渲染整个表单也没有任何区别。

这是我使用Chrome开发人员工具-> Elements时HTML字段显示的内容。

<textarea cols="40" id="id_details" name="details" rows="10" required="" data-processed="0" data-config="{&quot;skin&quot;: &quot;moono-lisa&quot;, &quot;toolbar_Basic&quot;: [[&quot;Source&quot;, &quot;-&quot;, &quot;Bold&quot;, &quot;Italic&quot;]], &quot;toolbar_Full&quot;: [[&quot;Styles&quot;, &quot;Format&quot;, &quot;Bold&quot;, &quot;Italic&quot;, &quot;Underline&quot;, &quot;Strike&quot;, &quot;SpellChecker&quot;, &quot;Undo&quot;, &quot;Redo&quot;], [&quot;Link&quot;, &quot;Unlink&quot;, &quot;Anchor&quot;], [&quot;Image&quot;, &quot;Flash&quot;, &quot;Table&quot;, &quot;HorizontalRule&quot;], [&quot;TextColor&quot;, &quot;BGColor&quot;], [&quot;Smiley&quot;, &quot;SpecialChar&quot;], [&quot;Source&quot;]], &quot;toolbar&quot;: &quot;Custom&quot;, &quot;height&quot;: 291, &quot;width&quot;: 835, &quot;filebrowserWindowWidth&quot;: 940, &quot;filebrowserWindowHeight&quot;: 725, &quot;toolbar_Custom&quot;: [[&quot;Bold&quot;, &quot;Italic&quot;, &quot;Underline&quot;], [&quot;NumberedList&quot;, &quot;BulletedList&quot;, &quot;-&quot;, &quot;Outdent&quot;, &quot;Indent&quot;, &quot;-&quot;, &quot;JustifyLeft&quot;, &quot;JustifyCenter&quot;, &quot;JustifyRight&quot;, &quot;JustifyBlock&quot;], [&quot;Link&quot;, &quot;Unlink&quot;], [&quot;RemoveFormat&quot;, &quot;Source&quot;]], &quot;language&quot;: &quot;en-us&quot;}" data-external-plugin-resources="[]" data-id="id_details" data-type="ckeditortype"></textarea>

3 个答案:

答案 0 :(得分:2)

Ck编辑器

步骤1:pip install django-ckeditor

第2步:INSTALLED_APPS = ['ckeditor',]

步骤3:转到==> models.py并添加文本字段RichTextField

像这样:

from ckeditor.fields import RichTextField

class Post(models.Model):
    author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
    title = models.CharField(max_length=200)
    text = RichTextField(blank=True, null=True)

步骤4:python manage.py makemigrations and migrate

第5步:现在检查管理页面,ckeditor是否适用于文本字段

如果要在html文件中添加ckeditor

第6步:在forms.py

class PostForm(forms.ModelForm):
    class Meta:
        model = Post
        fields = ('title','text',)

步骤7:在html文件中添加两行代码:

{{ form.text | safe }}
{{ form.media }}

答案 1 :(得分:0)

您在以下两行中输入了错误的内容。

Message

它们必须不在Meta类之内,因此如下所示。

brief = forms.CharField(widget=CKEditorWidget())
content = forms.CharField(widget=CKEditorWidget())

答案 2 :(得分:0)

我建议使用本教程by Samuli Natri。 就我而言,我创建了一个模型:

from ckeditor.fields import RichTextField
from ckeditor_uploader.fields import RichTextUploadingField

class Article(models.Model):
    title = RichTextField(blank=True, null=True)
    content = RichTextUploadingField(blank=True, null=True)
    author = models.ForeignKey(User, on_delete=models.CASCADE)

    def get_absolute_url(self): #redirects to detail view of this post
        return reverse("post-detail", kwargs={"pk": self.pk})

,然后在我的views.py中,我有一个基于类的视图,不需要创建表单。


from django.views.generic import(CreateView)
from .models import Article

class ArticleCreateView(CreateView):
    model = Article
    fields = ['title', 'content']

重要的是,您的html具有以下标记

<form method="POST">
      {% csrf_token %}
      {{ form.media }} <!-- ckeditor thing -->
      {{ form }}
      <button class="btn" type="submit">Post</button> 
</form>