zoukankan      html  css  js  c++  java
  • Ckeditor通过Ajax更新数据

      做编辑Get info的时候用ajax请求后端数据,然后赋值到超文本框上。一般分为两种,一种是同步,一种是异步。

    异步情况下可以参考 https://my.oschina.net/u/3142419/blog/1621789 ,该1思路是异步拿到数据后,销毁组件,然后再次实例化组件。 思路2是用官方的方法,SetData后回调进行一个渲染,不过第2个我没有试验成功。

    注意:

    如果不是必须要用异步的话,其实可以把ajax改成同步就可以很简单的赋值给Ckeditor富文本框了。

    如下是我的组件实例化,因为我需要用的东西比较多,所以设置的属性也稍微多上几个。

        // instance, using default configuration.
        var myeditor = CKEDITOR.replace('editor1', {
            format_tags: 'p;h1;h2;h3;h4;h5;h6;pre;address;div',
            filebrowserImageUploadUrl: UploadEditor + '?token=' + token,
            removeDialogTabs: 'image:advanced;link:advanced',
            removePlugins:'elementspath,resize',
            codeSnippet_theme: 'zenburn',
            height:'300'
        });
        CKEDITOR.stylesSet.add('my_styles', [
            // Block-level styles.
            {name: 'Blue Title', element: 'h2', styles: {color: 'Blue'}},
            {name: 'Red Title', element: 'h3', styles: {color: 'Red'}},
    
            // Inline styles.
            {name: 'CSS Style', element: 'span', attributes: {'class': 'my_style'}},
            {name: 'Marker: Yellow', element: 'span', styles: {'background-color': 'Yellow'}}
        ]);
        CKEDITOR.config.stylesSet = 'my_styles';
        CKEDITOR.config.image_previewText = ' '

    如下是我获取数据进行一个赋值,注意主要是这个  async: false,就是同步,这样就可以简单的使用 setData

    //get info function
    function getInfo(){
        $.ajax({
            url: apiOnlineCourseThemeGet,
            type: 'GET',
            async: false,
            data: {id:onlineCourseThemeId},
            success: function(json) {
                myeditor.setData(json.data.onlineCourseThemeDetails)
    
            }
        });
    }
  • 相关阅读:
    shell-脚本_系统监测
    shell-脚本_防火墙规则的简单应用
    shell-命令_find
    shell-命令_cut
    shell-条件测试语句_test
    Error:java: 不再支持源选项 5。请使用 6 或更高版本。
    android项目删除recycleview相对应的数据库数据后闪退
    大作业--社团管理系统总结
    北京地铁出行路线代码分析
    北京地铁出行路线规划设计
  • 原文地址:https://www.cnblogs.com/ShenShanXueRen/p/14680070.html
Copyright © 2011-2022 走看看