It is documented in ModalWindow javadoc: If you want to use form in modal window component make sure that you put the modal window itself * in another form (nesting forms is legal in Wicket) and that the form on modal window is submitted * before the window get closed.
On Fri, Oct 29, 2010 at 3:59 PM, Maris Orbidans <maris.orbid...@ingg.com>wrote: > Yes, it worked. > Thanks a lot. > > I hope developers will fix the issue. > > Maris > > > -----Original Message----- > > From: Leszek Gawron [mailto:lgaw...@apache.org] > > Sent: 29 October 2010 14:20 > > To: users@wicket.apache.org > > Subject: Re: Trying to submit form with id that is not in document. > > > > On 2010-10-29 14:06, Maris Orbidans wrote: > > > Hi > > > > > > I have a modal window with a panel inside it. After I refresh the panel > > > via ajax all buttons inside the panel stop working. Submit doesn't work > > > and there is this message in ajax debug window: > > > > > > ERROR: Wicket.Ajax.Call.submitFormById: Trying to submit form with id > > > 'categoryListForm135' that is not in document. > > > > > > > > > This is relevant output from ajax debug: > > > > > > > > > <?xml version="1.0" > > > encoding="UTF-8"?><ajax-response><header-contribution > encoding="wicket1" > > >> <![CDATA[<head xmlns:wicket="http://wicket.apache.org";><script > > > type="text/javascript" > > > > src="resources/org.apache.wicket.markup.html.WicketEventReference/wicket > > > -event.js"></script> > > > <script type="text/javascript" > > > > src="resources/org.apache.wicket.ajax.WicketAjaxReference/wicket-ajax.js > > > "></script> > > > <script type="text/javascript" > > > > src="resources/org.apache.wicket.ajax.AbstractDefaultAjaxBehavior/wicket > > > -ajax-debug.js"></script> > > > <script type="text/javascript" > > > id="wicket-ajax-debug-enable"><!--/*--><![CDATA[/*><!--*/ > > > wicketAjaxDebugEnable=true; > > > /*-->]^]^>*/</script> > > > > > > </head>]]></header-contribution><component id="categoryListPanel112" > > >> <![CDATA[<div id="categoryListPanel112"> > > > > > > <form id="categoryListForm135" method="post" > > > > action="?wicket:interface=:0:buttonsPanel:packagesWindow:content:categor > > > yListPanel:categoryListForm::IFormSubmitListener::"><div > > > > style="width:0px;height:0px;position:absolute;left:-100px;top:-100px;ove > > > rflow:hidden"><input type="hidden" name="categoryListForm135_hf_0" > > > id="categoryListForm135_hf_0" /></div> > > > > > > <table class="betlim"> > > > <tr> > > > <th>Name</th> > > > <th>Description</th> > > > <th></th> > > > </tr> > > > <tr> > > > <td> > > > <span>NONE</span> > > > </td> > > > <td> > > > <span>NO CATEGORY</span> > > > </td> > > > <td> > > > <input type="button" value="Delete" > > > name="categories:1:deleteBtn" id="deleteBtn136" onclick="if > > > (!confirm('Are you sure you want to delete package category NONE ?')) > > > {return}; null;var wcall=wicketSubmitFormById('categoryListForm135', > > > > '?wicket:interface=:0:buttonsPanel:packagesWindow:content:categoryListPa > > > > nel:categoryListForm:categories:1:deleteBtn::IActivePageBehaviorListener > > > :0:-1&wicket:ignoreIfNotActive=true', 'categories:1:deleteBtn' > > > ,function() { }.bind(this),function() { }.bind(this), function() > {return > > > > Wicket.$$(this)&&Wicket.$$('categoryListForm135')}.bind(this));; > > > ; return false;"/> > > > </td> > > > > > > > > > .... > > > > > > > > > </table> > > > > > > </form> > > > > > > </div>]]></component><component id="feedback134"><![CDATA[<span > > > id="feedback134"> > > > <ul class="feedbackPanel"> > > > <li class="feedbackPanelINFO"> > > > <span class="feedbackPanelINFO">Package category'3333' > > > added.</span> > > > </li> > > > </ul> > > > </span>]]></component></ajax-response> > > > > > > > > > As you can see there is form with id "categoryListForm135". > > > For some reason javascript cannot find it. > > > > > > > > > Panel html: > > > > > > > > > <wicket:panel> > > > > > > <form wicket:id="categoryListForm"> > > > > > > <table class="betlim"> > > > <tr> > > > <th>Name</th> > > > <th>Description</th> > > > <th></th> > > > </tr> > > > <tr wicket:id="categories"> > > > <td> > > > <span wicket:id="name"></span> > > > </td> > > > <td> > > > <span wicket:id="description"></span> > > > </td> > > > <td> > > > <input type="button" wicket:id="deleteBtn" > > > value="Delete"/> > > > </td> > > > </tr> > > > </table> > > > > > > </form> > > > > > > </wicket:panel> > > > > > > When it happens there is javascript error "form is null" in > > > wicket-ajax.js > > > > > > submitFormById: function(formId, submitButton) { > > > var form = Wicket.$(formId); > > > if (form == null || typeof (form) == "undefined") > > > Wicket.Log.error("Wicket.Ajax.Call.submitFormById: Trying to submit > form > > > with id '"+formId+"' that is not in document."); > > > return this.submitForm(form, submitButton); > > > }, > > > submitForm: function(form, submitButton) { > > > if (form.onsubmit) { // ERROR IS HERE > > > if (!form.onsubmit()) return; > > > } > > > if (this.handleMultipart(form, submitButton)) { > > > return true; > > > } > > > var body = function() { > > > var s = Wicket.Form.serialize(form); > > > if (submitButton != null) { > > > s += Wicket.Form.encode(submitButton) + "=1"; > > > } > > > return s; > > > } > > > return this.request.post(body); > > > > > > > > > Any idea what can be wrong? > > > > yes ... your modal window has to be put into a form, so the panel's form > > is nested: > > > > Example: > > > > > public class TrackerGroupsPanel extends Panel { > > > @SpringBean > > > private FleetService fleetService; > > > @SpringBean > > > private TrackerService trackerService; > > > > > > private ModalWindow modalWindow; > > > protected FeedbackPanel feedback; > > > > > > public TrackerGroupsPanel( String id, final IModel<Fleet> model ) { > > > super( id, model ); > > > setOutputMarkupId( true ); > > > > > > add( new Form<Void>( "form" ) { > > > { > > > add( feedback = new FeedbackPanel( > "feedback" ) ); > > > feedback.setOutputMarkupId( true ); > > > > > > add( modalWindow = new ModalWindow( > "modalWindow" > > ) ); > > > modalWindow.setWindowClosedCallback( new > > WindowClosedCallback() { > > > @Override > > > public void onClose( > AjaxRequestTarget > > target ) { > > > target.addComponent( > > TrackerGroupsPanel.this ); > > > } > > > } ); > > > > > > add( new AjaxLink<Fleet>( "registerGroup", > model ) > > { > > > @Override > > > public void onClick( > AjaxRequestTarget > > target ) { > > > modalWindow.setTitle( "Nowa > grupa > > pojazdów" ); > > > modalWindow.setContent( new > > TrackerGroupPanel( modalWindow.getContentId(), Model.of( new > TrackerGroup( > > > > > getModelObject() ) ) ) { > > > @Override > > > protected void > onSave( > > AjaxRequestTarget target ) { > > > > modalWindow.close( target > > ); > > > } > > > > > > } ); > > > target.addComponent( > feedback ); > > > modalWindow.show( target ); > > > } > > > } ); > > [...] > > > > > > then you will hit another bug if your form starts using ajax onchange > > notifications ... but that is another tale :) > > > > -- > > Leszek Gawron http://lgawron.blogspot.com > > > > --------------------------------------------------------------------- > > To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org > > For additional commands, e-mail: users-h...@wicket.apache.org > > > > > > _____________________________________________________________________ > > This e-mail has been scanned for viruses by MessageLabs. > > --------------------------------------------------------------------- > To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org > For additional commands, e-mail: users-h...@wicket.apache.org > >
