InputRichText - 如何使用Icefaces InputRichText?

时间:2013-03-25 21:21:44

标签: javascript jsf components ckeditor icefaces-1.8

我正在使用ice:inputRichText。我想获取所选文本 - 这与客户端有关,我的意思是 - 在服务器端操作它并将其放回编辑器(在选定的同一位置)。请问一些最佳实践 - 如何使用这个JSF组件?

非常感谢。


我还是不明白,ice:inputRichText是如何工作的。在这个问题上,CKEDITOR和服务器之间的沟通存在很大问题。

我有一个带有onclick动作和服务器动作的commandLink。 onclick操作从CKEDITOR获取选定的文本并将其放入隐藏字段。然后我可以在服务器端操作它。它第一次工作正常。但是在动作之后,inputRichText组件正在刷新(或类似的东西),然后无法重复动作(仅启动onclick部分,也不启动服务器端)。如果我将commandLInk标记中的immediate属性设置为true,它会起作用,但是我丢失了应用程序的一些功能。所以我说,在ice的上下文中存在一些验证错误:inputRichText。你能给我一些建议吗?

谢谢!

1 个答案:

答案 0 :(得分:1)

IceFaces将负责从服务器中的客户端编辑器更新数据,您可以在服务器上执行操作并在xhtml中保持值绑定,IceFaces将负责显示客户端服务器上所做的更改。

以下是如何使用icefaces富文本编辑器的示例。

<ice:inputRichText id="inptTxtSelected" value="#{mybean.note}"
      rendered="#{!empty mybean.note}"
      height="295px" toolbar="editorToolbar" width="625px"
      customConfigPath="/templates/js/richTextEditorConfig.js" saveOnSubmit="true"/>

您可以使用richTextEditorConfig.js

在编辑器上配置按钮
CKEDITOR.editorConfig = function(config) {
        config.toolbarCanCollapse = false;
        config.resize_enabled = false;
    config.toolbar = 'editorToolbar';
    config.height ='180px';
    config.baseFloatZIndex = 20000; 
    config.resize_maxWidth = "100%";    
    config.uiColor = '#E4E8F7';
    config.skin='office2003';
    config.toolbar_editorToolbar = [
 ['Preview','-','Link','Unlink','-','Bold','Italic',
       'Underline','- ','NumberedList','BulletedList']        
];
};

你的Bean应该有价值,

public class MyBean {

    private String note;
    //getter and setter to follow

    public void manipulateText(ActionEvent e){ 
        note = "set from server";
    }
}