Daniele, So why don't you collect a list of markup-ids serverside, perform a TinyMCE unload through AjaxRequestTarget.prepentJavascript(), and then have it redraw the list and load TinyMCE in appendJavascript()?
Another alternative would be to manually add the component trough javascript, see: http://wicketinaction.com/2008/10/repainting-only-newly-created-repeater-items-via-ajax/; This way you do not need to refresh all items in the listview Hope this helps, TinyMCE + AJAX is interesting to say the least. Daniele Dellafiore wrote: > > yep I do that. Actually, I wrote that article :) > > My problem is more subtle here and I have discovered now that is > related to javascript execution order. In fact I open a new thread to > investigate that specific issue. I also try to produce a ExamplePage > to commit on tinymce example project. > > On Fri, Oct 9, 2009 at 7:47 PM, Dane Laverty <danelave...@gmail.com> > wrote: >> Did you get the >> response.renderJavascriptReference(TinyMCESettings.javaScriptReference()); >> ? >> >> In my code it goes like this (as per >> http://wicketbyexample.com/wicket-tinymce-some-advanced-tips/): >> >> add(new HeaderContributor(new IHeaderContributor() { >> public void renderHead(IHeaderResponse response) { >> >> response.renderJavascriptReference(TinyMCESettings.javaScriptReference()); >> } >> })); >> >> Dane >> >> On Fri, Oct 9, 2009 at 10:17 AM, Daniele Dellafiore >> <ilde...@gmail.com>wrote: >> >>> I start from the end: I need fine control over the order javascript is >>> executed. What is the javascript to call a refresh on a component like >>> is done when I use target.addComponent()? >>> >>> >>> From the start. >>> I make that work with bgooren suggestion, using the javascript to >>> remove the editor. No need to remove the behavior on java side. That >>> works for the checkbox that dynamically adds and removes the Rich >>> Editor. >>> >>> Now, the problem on refreshing a list of fields. >>> What happens: to add a new field, click on ADD and I add my ListView >>> is added to be refreshed via a target.addComponent(). In doing this, >>> the markupId of the component changes, so tinyMce lose reference to >>> it's existing editors. >>> >>> My solution: on the ADD callback, I remove the editors and let them be >>> re-added during repainting. Works? NO! >>> Why? because the listView is repainted before the mceControlRemove is >>> executed, even if they are added to the same AjaxRequestTarget in the >>> ADD callback. So happens that: >>> 1. the remove fails because the old component is found no more >>> 2. after, the submit fails because tinyMCE still have the old editor >>> reference. >>> >>> --> ;( >>> >>> On Mon, Oct 5, 2009 at 11:44 AM, Daniele Dellafiore <ilde...@gmail.com> >>> wrote: >>> > Hey Bas, thanks for answering. >>> > >>> > Unfortunately it does not work. >>> > Even if I run: >>> > >>> > String removeEditor = >>> "tinyMCE.execCommand('mceRemoveControl', >>> > false, '" >>> > + propertyPanel.getValueMarkupId() + "');"; >>> > target.appendJavascript(removeEditor); >>> > >>> > or simply remove the TinyMceBehavior from my TextField, the result is >>> the >>> > same: mce editor disappear correclty, but remains in tinyMCE.editors >>> list >>> so >>> > Tiny tries to process it in a successive iteration. >>> > >>> > I try to find help on tinyMCE forum >>> > >>> > >>> > On Mon, Oct 5, 2009 at 10:59 AM, bgooren <b...@iswd.nl> wrote: >>> >> >>> >> I'll show you some parts of my code so you get an idea of how I do >>> things. >>> >> >>> >> First of all, I have used AjaxEditableLabel from wicket-extensions as >>> a >>> >> starting point. >>> >> TinyMCE's javascripts should always be loaded: >>> >> >>> >> // Preload TinyMCE >>> >> add( new AbstractBehavior() >>> >> { >>> >> >>> >> �...@override >>> >> public void renderHead( IHeaderResponse response ) >>> >> { >>> >> if( !tinyMCELoaded ) >>> >> { >>> >> response.renderJavascriptReference( >>> >> TinyMCESettings.javaScriptReference() ); >>> >> >>> >> settings = buildTinyMCESettings(); >>> >> >>> >> tinyMCELoaded = true; >>> >> } >>> >> } >>> >> >>> >> } ); >>> >> >>> >> In my case TinyMCE is loaded through an AJAX call: >>> >> >>> >> @SuppressWarnings("unchecked") >>> >> �...@override >>> >> protected void onEdit( AjaxRequestTarget target ) >>> >> { >>> >> super.onEdit( target ); >>> >> >>> >> final String id = editor.getMarkupId( true ); >>> >> final StringBuilder buf = new StringBuilder(); >>> >> >>> >> // Load plugins >>> >> buf.append( settings.getLoadPluginJavaScript() ).append( ";\n" >>> ); >>> >> >>> >> // Initialize tinyMCE >>> >> buf.append( "tinyMCE.init({" ).append( settings.toJavaScript( >>> >> Mode.none, Collections.EMPTY_LIST ) ).append( " });\n" ); >>> >> buf.append( settings.getAdditionalPluginJavaScript() ).append( >>> >> ";\n" >>> >> ); >>> >> >>> >> // Setup editor >>> >> buf.append( "tinyMCE.execCommand('mceAddControl',true,'" >>> ).append( >>> >> id ).append( "');" ); >>> >> >>> >> // Request focus on editor >>> >> buf.append( "setTimeout( function() >>> >> {tinyMCE.execCommand('mceFocus',true,'" ).append( id ).append( "');}, >>> 500 >>> >> );" ); >>> >> >>> >> target.appendJavascript( buf.toString() ); >>> >> } >>> >> >>> >> As you can see I initialize TinyMCE, and then perform an >>> mceAddControl >>> >> command on the textarea I want to convert to a TinyMCE editor. >>> >> >>> >> Finally, I need to switch back to a textarea before unloading, so the >>> >> correct contents are POSTed. To do so, I have added an >>> AjaxCallDecorator >>> >> to >>> >> the close request, and allow implementations to override it: >>> >> >>> >> @Override >>> >> protected IAjaxCallDecorator getCloseDecorator() >>> >> { >>> >> return new AjaxCallDecorator() >>> >> { >>> >> >>> >> �...@override >>> >> public CharSequence decorateScript( CharSequence script ) >>> >> { >>> >> return "tinyMCE.execCommand('mceRemoveControl', false, >>> '" >>> + >>> >> editor.getMarkupId() + "'); " >>> >> + super.decorateOnSuccessScript( script ); >>> >> >>> >> // Call to save contents back to textarea >>> >> // return "tinyMCE.get('" + editor.getMarkupId() + >>> >> "').save(); " + >>> >> // super.decorateScript( script ); >>> >> } >>> >> >>> >> }; >>> >> } >>> >> >>> >> The above code removes TinyMCE from the given textarea, and saves the >>> HTML >>> >> back into the textarea. I have commented out the call to save(), >>> since >>> it >>> >> was not necessary. >>> >> >>> >> Bas >>> >> >>> >> >>> >> Daniele Dellafiore wrote: >>> >> > >>> >> > I get what the real problem is: tinyMce saves internally each >>> "editor" >>> >> > that >>> >> > is added to a page in a list called, well, editors. >>> >> > When I remove the behavior from a textField, I should also call >>> >> > tinyMce.remove passing the editors as a parameter. >>> >> > >>> >> > I will try to do this but any help is appreciated :) >>> >> > >>> >> > This is for the checkbox that enable/disable the tinyMce behavior. >>> >> > >>> >> > >>> >> > I have a more subtle situation: I have a list of textFields and a >>> button >>> >> > to >>> >> > add more. When I add a new field, I refresh the list via AJAX to >>> show >>> >> > the >>> >> > new field. But, refreshing the list also causes the html id of any >>> >> > element >>> >> > in the list to change! >>> >> > >>> >> > So, when in the end I submit the form, tinyMce cannot find its >>> editors >>> >> > anymore cause the parent DIV of the INPUT field that has an >>> associated >>> >> > tinyMce editor just changed it's html id. >>> >> > Given that the id will change and there is no alternatives, I have >>> to >>> >> > find >>> >> > a >>> >> > way to keep the associations or to clean all editors and recreate >>> them >>> >> > at >>> >> > every list refresh. >>> >> > >>> >> > What is your suggesions? >>> >> > >>> >> > -- >>> >> > Daniele Dellafiore >>> >> > http://blog.ildella.net >>> >> > http://twitter.com/ildella >>> >> > >>> >> > >>> >> >>> >> -- >>> >> View this message in context: >>> >> >>> http://www.nabble.com/-tinymce--problem-adding-removing-TinyMceBehavior-dinamically-tp25681833p25747314.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 >>> >> >>> > >>> > >>> > >>> > -- >>> > Daniele Dellafiore >>> > http://blog.ildella.net >>> > http://twitter.com/ildella >>> > >>> >>> >>> >>> -- >>> Daniele Dellafiore >>> http://blog.ildella.net >>> http://twitter.com/ildella >>> >>> --------------------------------------------------------------------- >>> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org >>> For additional commands, e-mail: users-h...@wicket.apache.org >>> >>> >> > > > > -- > Daniele Dellafiore > http://blog.ildella.net > http://twitter.com/ildella > > --------------------------------------------------------------------- > 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--problem-adding-removing-TinyMceBehavior-dinamically-tp25681833p25857140.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
