Django3.2 ckeditor根据ID修改博客文章

云淡风轻58

于 2021-10-08 21:45:08 发布

阅读量217

点赞数 1

分类专栏： Django 文章标签： python ckeditor django

本文链接：https://blog.csdn.net/dwenxue/article/details/120660286

版权

Django 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

本项目使用的Models请参考上篇

ckeditor富文本编辑器(Django 3.2)_云淡风轻58的博客-CSDN博客

博客首页

后台博客列表

models.py

from ckeditor_uploader.fields import RichTextUploadingField
from django.db import models
from user.models import Admin
class Category(models.Model):
    categoryName=models.CharField('分类',max_length=10)
    class Meta:
        verbose_name = '分类'
        verbose_name_plural = '分类'

    def __str__(self):
        return self.categoryName

class Blog(models.Model):
    title = models.CharField(max_length=50)
    category = models.ForeignKey(Category, on_delete=models.CASCADE, verbose_name='分类')
    author = models.ForeignKey(Admin, on_delete=models.CASCADE, verbose_name='作者')
    createdTime = models.DateTimeField('发布时间', auto_now_add=True)
    readCount = models.CharField('阅读数量', max_length=10)
    replyCount = models.CharField('回复数量', max_length=10)
    content=RichTextUploadingField(verbose_name='正文')

    class Meta:
        verbose_name = '文章'
        verbose_name_plural = '文章'

    def __str__(self):
        return self.title

class Info(models.Model):
    nickname = models.CharField(max_length=30)
    homePage = models.CharField(max_length=50)
    address = models.CharField(max_length=50)
    job = models.CharField(max_length=30)

    class Meta:
        verbose_name = '个人档案'
        verbose_name_plural = '档案'

    def __str__(self):
        return self.nickname

editBlog.html

<!DOCTYPE html>
<html lang="en">
<head>
    {% load static %}
    <meta charset="UTF-8">
    <title>Ckeditor编辑器</title>
    <link rel="stylesheet" href="{% static 'layui/css/layui.css' %}" media="all">
    <script src="{% static 'ckeditor/ckeditor/ckeditor.js' %}"></script>
    <script src="/static/admin/js/admin/RelatedObjectLookups.js"></script>
</head>
<body>
<div class="layui-fluid" style="margin-top: 10px;">
    <form class="layui-form" method="post" action="/update/" enctype="multipart/form-data">
        {% csrf_token %}
            <input type="hidden" name="id" value="{{ blog.id }}">
            <div class="layui-form-item layui-col-xs6">
                <label class="layui-form-label">标题</label>
                <div class="layui-input-block">
                  <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input" width="300px" value="{{ blog.title }}">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">分类</label>
                <div class="layui-input-inline">
                  <select name="category" >
                    <option value="{{ blog.category }}">{{ blog.category }}</option>
                   {% for c in categorys %}
                    <option value="{{ c.categoryName }}">{{ c.categoryName }}</option>
                   {% endfor %}
                  </select>
                </div>
            </div>
            <div class="layui-form-item layui-form-text layui-col-xs6">
                <label class="layui-form-label">内容</label>
                <div class="layui-input-block">
                    <textarea type="text" name="content">
                        {{ blog.content | safe }}
                    </textarea>

                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                  <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">发布</button>
                  <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
    </form>
</div>
<script src="{% static 'layui/layui.js' %}"></script>
<script type="text/javascript">
    layui.use('form', function(){
      var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
      var res = '{{ res }}';
		if (res == 'ok') {
			layui.use('layer', function() {
				var layer = layui.layer;
				layer.msg('操作成功');
			});

		}
		if (res == 'fail') {
			layui.use('layer', function() {
				var layer = layui.layer;
				layer.msg("操作成功");
			});
		}
      form.render();
    });
</script>
<script type="text/javascript">
    CKEDITOR.replace( 'content',{width: 700 , height: 400 });
</script>
</body>
</html>

views.py

def editBlog(request,id):
    blog = Blog.objects.get(id=id)
    categorys = Category.objects.all()
    return render(request, 'editBlog.html',locals())

urls.py

urlpatterns = [
    path('editBlog/<str:id>', views.editBlog),
]

settings.py中配置ckeditor

CKEDITOR_CONFIGS = {
'default': {
        'toolbar': (
            ['div','Source','-','Save','NewPage','Preview','-','Templates'],
            ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print','SpellChecker','Scayt'],
            ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
            ['Form','Checkbox','Radio','TextField','Textarea','Select','Button', 'ImageButton','HiddenField'],
            ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
            ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
            ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
            ['Link','Unlink','Anchor'],
            ['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
            ['Styles','Format','Font','FontSize'],
            ['TextColor','BGColor'],
            ['Maximize','ShowBlocks','-','About', 'pbckcode'],
            ['Blockquote', 'CodeSnippet'],
        ),
        'width': '800',
        'height':'400',
        # 添加按钮在这里
        'toolbar_Custom': [
            ['NumberedList', 'BulletedList'],
            ['Blockquote', 'CodeSnippet'],
        ],
       # 插件
        'extraPlugins': ','.join(['codesnippet','widget','lineutils',]),
    },
}

根据ID编辑博客内容

这样虽然功能是实现了，但是有个问题不能上传图片，暂时没有找到解决方法，如果有知情者请不吝赐教，多谢。

云淡风轻58

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
Django3.2 ckeditor根据ID修改博客文章

本项目使用的Models请参考上篇ckeditor富文本编辑器(Django 3.2)_云淡风轻58的博客-CSDN博客博客首页后台博客列表models.pyfrom ckeditor_uploader.fields import RichTextUploadingFieldfrom django.db import modelsfrom user.models import Adminclass Category(models.Model): cat..
复制链接

扫一扫