I am trying to implement something similar. Would you mind telling me how you
added the AjaxCallDecorator? You said add it to the Panel but I don't see
any methods for that.

Thanks,

Josh


Sverre Boschman wrote:
> 
> For wicket 1.3.4/5 in combination with the latest 1.3 wicket-tinymce
> snaphot I solved this problem the following way. 
> 
> Note: Also linked to newer tinymce scripts than those supplied in the
> wicket-tinymce jar (building my own javascript reference for that, as
> you will notice in the code).
> 
> Create a page behaviour, supply your tinymce settings in the contructor
> f.e.
> This page behaviour will initialize the tinymce editor on the page, but
> does not make any textfields tinymce aware. Having the editor
> initialized on the page will allow you to add textfields with ajax calls
> and make them tinymce aware. See below for some example code.
> 
> Next you have to make your own TinyMCEBehavior. The default renderHead
> method does not handle ajax reponses very well. So I rewrote the part
> where it generates the javascript that has to be attached to the
> component (the textfield most likely).
> The real voodoo is the getRenderOnDomReadyJavascript() method, which
> checks for an AjaxHeaderResponse (private inner class... so an ugly
> string comparison on the classname) and makes the javascript call
> (tinyMCE.execCommand('mceAddControl'...) to the editor already
> initialized on the page to transform a textfield in an tinymce
> textfield.
> 
> If you want to play around with the focus, you can use this (I have this
> in an onAjaxLoad() method on the panel, which get called when the panel
> is loaded by an ajax call):
> tinyMCE.execCommand('mceFocus',false,'" + <markupId> + "');
> 
> But more important is adding an AjaxCallDecorator to the panel that gets
> fired when the panel is unloaded. It has to sync to tinymce input with
> the original textfield and it has to remove the textarea from the
> tinymce editor instance. If you don't, you run into problems with text
> not syncing after the second ajax replace.
> 
> Good luck with it,
> Sverre
> 
> 
> ---
> 
> public class TinyMceAjaxPageBehavior extends AbstractBehavior
> {
>       public TinyMceAjaxPageBehavior()
>       {
>               this(new TinyMCESettings());
>       }
> 
>       /**
>        * @param settings
>        */
>       public TinyMceAjaxPageBehavior(TinyMCESettings settings)
>       {
>               this.settings = settings;
>       }
> 
>       /**
>        * @see
> org.apache.wicket.behavior.AbstractBehavior#bind(org.apache.wicket.Compo
> nent)
>        */
>       @Override
>       public void bind(Component component)
>       {
>               super.bind(component);
>               path =
> component.getRequest().getRelativePathPrefixToContextRoot();
>       }
> 
>       /**
>        * @see
> wicket.contrib.tinymce.TinyMceBehavior#renderHead(org.apache.wicket.mark
> up.html.IHeaderResponse)
>        */
>       @Override
>       public void renderHead(IHeaderResponse response)
>       {
> 
>               response.renderJavascriptReference(path +
> "tiny_mce/tiny_mce.js", "tiny_mce");
>               response.renderJavascript(getAddTinyMceSettingsScript(),
> null);
>       }
> 
>       /**
>        * @see IridiumTinyMceBehavior.getAddTinyMceSettingsScript
>        */
>       protected String getAddTinyMceSettingsScript()
>       {
>               return "" + " tinyMCE.init({"
>                       + settings.toJavaScript(Mode.none, new
> ArrayList<Component>()) + " });\n"
>                       + settings.getLoadPluginJavaScript() +
> settings.getAdditionalPluginJavaScript();
>       }
> }
> 
> 
> public class MyTinyMceBehavior extends TinyMceBehavior
> {
>       /**
>        * @see
> wicket.contrib.tinymce.TinyMceBehavior#renderHead(org.apache.wicket.mark
> up.html.IHeaderResponse)
>        */
>       @Override
>       public void renderHead(IHeaderResponse response)
>       {
>               if (getComponent() == null)
>                       throw new IllegalStateException("TinyMceBehavior
> is not bound to a component");
> 
>               String path =
> getComponent().getRequest().getRelativePathPrefixToContextRoot();
>               response.renderJavascriptReference(path +
> "tiny_mce/tiny_mce.js", "tiny_mce");
> 
>               // Supplied tinyMCE version in the wicket-tinymce jar
>               //
> response.renderJavascriptReference(TinyMCESettings.javaScriptReference()
> );
> 
>               String renderOnDomReady =
> getRenderOnDomReadyJavascript(response);
>               if (renderOnDomReady != null)
>               {
>       
> response.renderOnDomReadyJavascript(renderOnDomReady);
> 
>                       return;
>               }
> 
>               String renderJavaScript = getRenderJavascript(response);
>               if (renderJavaScript != null)
>                       response.renderJavascript(renderJavaScript,
> null);
>       }
> 
>       /**
>        * @see
> wicket.contrib.tinymce.TinyMceBehavior#getRenderOnDomReadyJavascript(org
> .apache.wicket.markup.html.IHeaderResponse)
>        */
>       @Override
>       protected String getRenderOnDomReadyJavascript(IHeaderResponse
> response)
>       {
>               if (getComponent() == null)
>                       throw new IllegalStateException("TinyMceBehavior
> is not bound to a component");
>               if
> (response.getClass().getName().endsWith("AjaxHeaderResponse"))
>                       return "tinyMCE.execCommand('mceAddControl',
> false, '" + getComponent().getMarkupId()
>                               + "');";
> 
>               return null;
>       }
> }
> 
> 
>               return new AjaxCallDecorator()
>               {
>                       private static final long serialVersionUID = 1L;
> 
>                       /**
>                        * @see
> org.apache.wicket.ajax.calldecorator.AjaxCallDecorator#decorateScript(ja
> va.lang.CharSequence)
>                        */
>                       @Override
>                       public CharSequence decorateScript(CharSequence
> script)
>                       {
>                               StringBuilder buffer = new
> StringBuilder(script.length() + 100);
>       
> buffer.append("tinyMCE.triggerSave(true,false);").append(script)
>                                       .append(
>       
> "tinyMCE.execCommand('mceRemoveControl', false, '" + area.getMarkupId()
>                                                       + "');");
>                               return buffer;
>                       }
>               };
> 
> 
> -----Oorspronkelijk bericht-----
> Van: martijn.lindh...@gmail.com [mailto:martijn.lindh...@gmail.com]
> Namens Martijn Lindhout
> Verzonden: donderdag 27 november 2008 16:57
> Aan: users@wicket.apache.org
> Onderwerp: TinyMCE in an Ajax loaded panel
> 
> Hi all,
> 
> I searched nabble, but couldn't find any recent posts that brought me a
> solution to this problem:
> 
> I have a page with two panels, a master/detail setup. The master has a
> list
> of items, the detail a TinyMCE editor. The details panel is invisible
> until
> the user clicks an item in the master list. The list disappears and the
> detail panel is shown, all using Ajax. The problem is that the TinyMCE
> editor doesn't appear, it's just a normal textarea.
> 
> Has anyone a solution to this problem?
> 
> Thanks
> 
> No virus found in this incoming message.
> Checked by AVG - http://www.avg.com 
> Version: 8.0.175 / Virus Database: 270.9.10/1812 - Release Date:
> 25-11-2008 19:53
> 
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> For additional commands, e-mail: users-h...@wicket.apache.org
> 
> 
> 

-- 
View this message in context: 
http://www.nabble.com/TinyMCE-in-an-Ajax-loaded-panel-tp20721519p22085676.html
Sent from the Wicket - User mailing list archive at Nabble.com.


---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org

Reply via email to