JSF中将CKeditor换位Ueditor的辛酸历程

    最近因为项目需要,一直在弄JSF。现在需求是,将PrimeFaces带的CKeditor换成Ueditor。本人水货一枚,不会写扩展,只能用Jquery基础替换。不知道和您的项目是否符合,仅供参考,高手请指导!!

    原来项目中使用ckeditor时,用的primefaces扩展标签。例如下面的代码。我不清楚其他的JSF是否是这么用的。

    这里我总结了三种替换方式,仅供参考。最后一种是针对p:dialog里面替换的。

   方式一、利用jquery的next()方法找到隐藏域。在script标签后放置一个隐藏域。隐藏域对应托管Bean的属性。提交表单时,将ueditor的值给了隐藏域。

      

 利用jquery的next()方法找到隐藏域。这个getUeditorValues()是那个具体提交表单的按钮的onclick绑定的。

 

方式二、利用class选择器找到隐藏域。这种方法跟方式一类似。在其他页面中,发现隐藏域并不能通过next()方法找到,它最后的页面居然是表格。h:inputHidden是没有styleClass的,所以我用h:inputText 替换,并设置display:none;

页面末尾放隐藏域。之所以放末尾是因为,上面最后成表格了。

js部分稍有变化

方式三、针对p:dialog。这个太奇怪了。每次打开时,都需要重新创建ueditor,关闭时销毁。不信的话可以自己试试其他方法,我是没有试出来。需要注意的是第一次打开可以显示,第二次打开就不显示了。就这个问题卡了两天。不知道你们的情景和我的是否一样。仅供参考。

在dialog页面中:

 1、onHide绑定销毁Ueditor的方法

 2、script 标签占位、隐藏域这些不变

 3、提交时将ueditor的内容给了隐藏域

在嵌入dialog的页面。onstart显示对话框,  oncomplete 初始化ueditor

 

猜你喜欢

转载自my.oschina.net/u/1444945/blog/546355
jsf