InputRichText - how to use Icefaces InputRichText?

Question

I am working with ice:inputRichText. I would like to get the selected text - this relates to the client side, I mean - manipulate it on the server side and put it back to the editor (on the same place, as the selected). Could you advice me please some best practise - how to work with this JSF component?

Thanks a lot.

I still don't understand, how the ice:inputRichText works. At the momment I have a big problem with communication between the CKEDITOR and the server.

I have got a commandLink with onclick action and server action. The onclick action takes a selected text from CKEDITOR and put it to a hidden field. Then I can manipulate it on the server side. For the first time it works fine. But after the action the inputRichText component is refreshing (or something like that) and then it is not possible to repeat the action (only the onclick part is launched, nor the server side). If I set the immediate attribute in the commandLInk tag to true, it works, but I lost some functionality of my application. So I mena, there are some validation errors in context of ice:inputRichText. Could you please give me advice?

Thank you!

Avinash Singh Avinash Singh · Accepted Answer · 2013-03-25T23:08:46

IceFaces will take care of updating the data from client editor in server , you can perform the manipulation on server and keep the value binding in xhtml , IceFaces will take care of showing the changes made on server on the client side.

Here is an example of how to use icefaces rich text editor.

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

You can configure the buttons on editor using 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']        
];
};

Your Bean should have value like ,

public class MyBean {

    private String note;
    //getter and setter to follow

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

InputRichText - how to use Icefaces InputRichText?

1 Answers