Reproduce Steps
1. Declare ckeditor instance inside jspx. i.e. jsp
2. Bind layout with ADF UIComponent
3. Partial refresh by UIComponent from server side
4. Text area can't replaced by CKEditor again after refresh from server
Source codes for 1st and 2nd step
<af:panelGroupLayout layout="scroll" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" [b] binding="#{pageFlowScope.entriesUI}" [/b] id="pgl2" inlineStyle="width:100%; border-color:White;"> ... ... <f:verbatim> <textarea id="EditorDefault" name="EditorDefault" rows="10" style="width:100%;" cols="2">"test"</textarea> <script type="text/javascript"> var editor = CKEDITOR.replace( 'EditorDefault',{ height:150,resize_enabled:false, toolbar : ['TextColor','BGColor'], toolbarCanCollapse : false} ) </f:verbatim> </af:panelGroupLayout>
Server side will invoke UIcomponent refresh, the 3rd step
//the component is java object bind with af:panelGroupLayout [b] binding="#{pageFlowScope.entriesUI}" [/b] if (component != null) { AdfFacesContext adfFacesContext = AdfFacesContext.getCurrentInstance(); adfFacesContext.addPartialTarget(component); }
Client text area can't be replaced after server side refresh.
Would like to more simplified codes, if necessary. Thanks in advance.