Odoo Website 替换 Summernote 为第三方富文本编辑器
随着用odoo的人越来越多,奇葩的需求也是越来越多。。。。
这不,有同学就想替换掉website forum里边的summernote控件,花了点时间研究了一下,先说结论:替换是可行的。
先上替换之后的图,这里替换的是kindeditor:
要替换成别的,也是可以的,只不过需要使用odoo的前端开发规则,本模块计划做成一个demo供参考。
替换步骤:
1. 首先将kindeditor的源文件引入到新模块中:

2. 将原来的summernote空间隐藏掉,并用kindeditor替代:
$('textarea.load_editor').each(function () {
var $textarea = $(this);
var $form = $textarea.closest('form');
$('.note-editor').hide();
KindEditor.ready(function(K){
window.editor=K.create($textarea,{
themeType:'default',
uploadJson : '/filemanager',
fileManagerJson : '/filemanager',
allowFileManager : true,
})
});
$form.on('click', 'button, .a-submit', function () {
window.editor.sync();
window.editor.html($textarea.val());
});
});
3. 你会发现虽然引用了新的控件,但是样式在提交后都消失不见了。。。。
解决方法:设置content字段的strip_style属性为false
4. 最后我们来解决图片上传的问题:
@http.route('/filemanager',type='http',auth="public",website=True,csrf=False)
def _store_file(self,*args,**kwargs):
img = kwargs['imgFile']
path = os.path.abspath(os.path.realpath(__file__)).split('controller')[0]+'static/files'
#os.path.abspath(join(os.getcwd(),'/web_kindeditor/static/files'))
filepath = path+'/'+img.filename
img.save(filepath)
url = request.env['ir.config_parameter'].get_param('web.base.url')+"/web_kindeditor/static/files/"+img.filename
return json.dumps({'error':0,'url':url})
5. 9.0 以后web url访问会有csrf验证的问题,这就是另外一回事儿了,有空再说。
Over。
模块共享地址依旧见群公告。
Odoo Website 替换 Summernote 为第三方富文本编辑器的更多相关文章
- SummerNote 富文本编辑器 - Rails 集成
使用官方提供的CDN服务 将下面一段加入layout文件中 <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css ...
- django的admin或者应用中使用KindEditor富文本编辑器
由于django后台管理没有富文本编辑器,看着好丑,展示出来的页面不美观,无法做到所见即所得的编辑方式,所以我们需要引入第三方富文本编辑器. 之前找了好多文档已经博客才把这个功能做出来,有些博客虽然写 ...
- Vue富文本编辑器(图片拖拽缩放)
富文本编辑器(图片拖拽缩放) 需求: 根据业务要求,需要能够上传图片,且上传的图片能在移动端中占满屏幕宽度,故需要能等比缩放上传的图片,还需要能拖拽.缩放.改变图片大小.尝试多个第三方富文本编辑器,很 ...
- summernote 富文本编辑器限制输入字符长度
项目中需要一个比较简单的富文本编辑器,于是选中了summernote .虽然比较轻量,但是在开发中也遇到了几个问题,在此记录一下. 1:样式和bootstrap冲突,初始化之后显示为: .note-e ...
- 超好用的富文本编辑器Summernote的使用
官网地址 中文文档 源码下载地址 Summernote依赖于jquery和bootstrap3/4 所以用时记得引入这俩依赖 奉上引入方法(官网说的很清楚,api也很详细): <!-- in ...
- summernote富文本编辑器
下载summernote官方demo,解压,把文件夹中的summernote.js,summernote.css和font整个文件夹都放到服务器对应的项目目录里 引入summernote 所需要的bo ...
- summernote富文本编辑器的使用
最近在开发一个微信公众号的后台,微信公众号编辑的文章一直没有得到很好地适应,大多数人也是在其他的编辑软件中编辑好之后直接去复制到微信公众平台中,考虑到复制后会排版出现问题,所以给大家推荐一款很不错的W ...
- summernote富文本编辑器配合validate表单验证无法进行表单提交的问题
1.使用summernote富文本编辑器提交图片到服务器 在使用bootstrap中,我们用到了summernote富文本编辑器,使用summernote将图片上传到服务器中,参考我的上篇文章http ...
- summernote(富文本编辑器)将附件与图片上传到自己的服务器(vue项目)
1.上传图片至自己的服务器(这个官方都有例子,重点介绍附件上传)图片上传官方网址 // onChange callback $('#summernote').summernote({ callback ...
随机推荐
- 编译原理实习(应用预测分析法LL(1)实现语法分析)
#include<iostream> #include<fstream> #include<iomanip> #include<cstdio> #inc ...
- Mock方法介绍
1 现有的单元测试框架单元测试是保证程序正确性的一种有效的测试手段,对于不同的开发语言,通常都能找到相应的单元框架. 借助于这些单测框架的帮助,能够使得我们编写单元测试用例的过程变得便捷而优雅.框架帮 ...
- Loadrunner中动态添加虚拟用户
添加的虚拟用户会立马开始执行: 场景组的两种模式: Vuser组模式: Vuser组模式中,对于压力负载机是不能同时添加多个 但是我们可以在一个脚本里通过多次添加Vuser,每次添加30个Vuser, ...
- 2016.5.27 php测试中敏感度高,怎么调整
在测试PHP代码的过程中,会遇到这样的问题:PHP提示Notice: Undefined variable,遇到这样的问题很纠结,但是很容易解决. 今天晚上,我就遇到了这样的问题,到网上搜索了很多解决 ...
- css布局2
居中 常用居中 elemP{ text-align: center; } elelmP elemC{ display: inline-block; } elemP{ display: table; m ...
- JavaScript 的同源策略
同源策略限制了一个源(origin)中加载文本或脚本与来自其它源(origin)中资源的交互方式. 同源定义 如果两个页面拥有相同的协议(protocol),端口(如果指定),和主机,那么这两个页面就 ...
- P2P的理解
B2C是Business-to-Customer的缩写,而其中文简称为“商对客”.“商对客”是电子商务的一种模式,也就是通常说的商业零售,直接面向消费者销售产品和服务.这种形式的电子商务一般以网络零售 ...
- node.js--HTTP模块
HTTP模块 node.js提供了一个创建自己服务器的方式,用起来很简单,首先引用http模块 //引用HTTP模板 var http = require('http'); 创建服务实例:http.c ...
- javascript拾掇
用javascript如何给span赋值呢?一般有两种方法: 1>输出html <body onload="s()"><span id="hell ...
- 02_Swift2基础之常量和变量+注释+分号
1. 常量和变量 常量 和 变量 把一个名字(比如 'number' 或者 'welcomeMessage')和一个指定类型的值(比如数字'10'或者字符串 ' "Hello" ' ...
