4 Replies Latest reply on Aug 8, 2012 12:13 AM by nguyen tung son

    rich:editor no display when load with ajax

    nguyen tung son Newbie

      I have editor.jsp file use component rich:editor:

       

      ....

       

      <rich:editor viewMode="visual"

      theme="advanced"

      value="#{c300Controller.CB317}" height="150" width="564">

      <jsp:include page="../../common/EditorComponent.jsp"></jsp:include>

      </rich:editor>

      ....

       

      when I call this file with link http://localhost:8084/editor.jsp it is ok...

       

      But when I load this file with ajax, it can't display editor

      example

      user fancybox

      <h:outputLink value="editReport.jsp?pv050=0&KeepThis=true&amp;TB_iframe=true&amp;height=453&amp;width=741&amp;modal=true" styleClass="fancybox add_new"  >

        <h:outputText value="Report"/>

      </h:outputLink>

      // it is ok if I config fancybox type is frame

       

      or I post with Jquery

       

      $.post("editor.jsp",function(data){

      if(data!=null) {

      object2.html(data);

      });

       

      PLEASE HELP ME.. THANKS ALL

      I found this link https://community.jboss.org/thread/14804 to fix problem but  unsuccessful...

        • 1. Re: rich:editor no display when load with ajax
          Brendan Healey Master

          I hit the same problem. There is an underlying problem with ckeditor and I don't see an easy fix. I've got it working though

          and tomorrow I'll tell you how (it's late for me now).

           

          Regards,

          Brendan.

          • 2. Re: rich:editor no display when load with ajax
            nguyen tung son Newbie

            Thanks for your support...

            I am waiting...

            • 3. Re: rich:editor no display when load with ajax
              Brendan Healey Master

              The solution I'm using is to use ckeditor directly, it can be downloaded here: http://ckeditor.com/download.

               

              Then I install it so that I have a folder (in a maven project) src/main/webapp/ckeditor. What you don't want is this resource

              to be served by facesservlet, I'm not sure why but I couldn't get it to work. In this example I have a property in a backing bean

              String emailContent, and when I click on the Send Email button note the contents of the onclick handler which is necessary.

               

              <h:head>

                <script type="text/javascript" src="/ckeditor/ckeditor.js"/>

                <script type="text/javascript" src="/ckeditor/adapters/jquery.js"/>

              </h:head>

               

              <h:body>

                      <h:form prependId="false">

                          <h:inputHidden id="emailHidden" value="#{beanParam.emailContent}"/>

                          <textarea id="emailContent" name="emailContent"/>

                          <script type="text/javascript">

                              if(CKEDITOR.instances["emailContent"]) {

                                  delete CKEDITOR.instances["emailContent"];

                              }

               

                              jQuery('#emailContent').ckeditor(function() {}, {

                                  toolbar: 'MyToolbar'

                              });

                          </script>

               

                          <a4j:commandButton id="sendButton" onclick="jQuery('#emailHidden').val(jQuery('#emailContent').val())" action="..."/>

                      </h:form>

              </h:body>

               

              The alternative to this would be to add the workaround:

               

              if(CKEDITOR.instances["emailContent"]) {

                        delete CKEDITOR.instances["emailContent"];

              }

               

              into the javascript file that ships with richfaces, whatever that may be.

               

              Regards,

              Brendan.