You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by LutherBaker <lu...@gmail.com> on 2010/09/28 19:49:29 UTC

Cancelling ala AjaxLink vs AjaxButton

I am popping up a ModalWindow with a form - which has Cancel and Submit
buttons. Unfortunately, I can't get the Cancel button to close the window.
It keeps submitting to the validator, stays on the form and echos validation
text to the feedback panel.

I can get it to work with an AjaxLink.


    &lt;a href="#" wicket:id="cancel.link"&gt;&lt;wicket:message
key="Application.cancelButton.label"/&gt;&lt;/a&gt;
    &lt;input wicket:id="cancel.button" type="button"
wicket:message="value:Application.cancelButton.label"/&gt;



			final AjaxLink cancelLink = new AjaxLink("cancel.link") {
				private static final long serialVersionUID = 1L;

				@Override
				public void onClick(final AjaxRequestTarget target) {
					modal.close(target);
				}

			};
			add(cancelLink);

			final AjaxButton cancel = new AjaxButton("cancel.button",
AreaEditorForm.this) {
				private static final long serialVersionUID = 1L;

				@Override
				protected void onSubmit(final AjaxRequestTarget target,
						final Form<?> form) {
					modal.close(target);
				}
			};
			cancel.setDefaultFormProcessing(false);
			add(cancel);


I thought that I could set default form processing = false but that doesn't
seem to be enough.

Thoughts?

-Luther

-- 
View this message in context: http://apache-wicket.1842946.n4.nabble.com/Cancelling-ala-AjaxLink-vs-AjaxButton-tp2717635p2717635.html
Sent from the Users forum mailing list archive at Nabble.com.

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


Re: Cancelling ala AjaxLink vs AjaxButton

Posted by LutherBaker <lu...@gmail.com>.
It turns out that it actually seems to work in IE.

For what it's worth, the javascript isn't working correctly in a virtual
install of Firefox 3.0.19. For all I know, could be related, in part, to our
software packaging/management process. I'll try and test in a few different
environments and confirm that this isn't a real problem.

Thanks for staying with this thread.

-Luther

-- 
View this message in context: http://apache-wicket.1842946.n4.nabble.com/Cancelling-ala-AjaxLink-vs-AjaxButton-tp2717635p2718183.html
Sent from the Users forum mailing list archive at Nabble.com.

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


Re: Cancelling ala AjaxLink vs AjaxButton

Posted by Igor Vaynberg <ig...@gmail.com>.
if onsubmit is not called most likely you have validation errors and
to see them you have to add the feedback panel in the onerror handler
of the button

-igor

On Tue, Sep 28, 2010 at 4:51 PM, LutherBaker <lu...@gmail.com> wrote:
>
> Thanks Igor, I've determined that something is not playing nicely here.
>
> The larger picture is this - user visits a page and clicks on Add to add a
> widget to the database. I pop up a ModalWindow with a form on it. User can
> (a) submit form, (b) cancel button (c) cancel link.
>
> I'd like to close the form on a successful submission or if the user clicks
> on either 'cancel' option.
>
>        private static class AreaEditorForm extends Form<Area> {
>                private static final long serialVersionUID = 1L;
>
>                public AreaEditorForm(final String id,
>                                final Area area,
>                                final ModalWindow modal) {
>                        super(id, new CompoundPropertyModel<Area>(area));
>                        final TextField<String> name = new TextField<String>("name");
>                        add(name);
>                        name.setRequired(true);
>                        name.add(new DefaultFocusBehavior());
>
>                        final TextArea<String> summary = new TextArea<String>("summary");
>                        summary.setRequired(true);
>                        add(summary);
>
>                        add(new AjaxButton("submit.button", AreaEditorForm.this) {
>                                private static final long serialVersionUID = 1L;
>
>                                @Override
>                                protected void onSubmit(final AjaxRequestTarget target,
>                                                final Form<?> form) {
>                                        System.out.println("submit.button AjaxButton.onSubmit(target)");
>                                        modal.close(target);
>                                }
>                        });
>
>                        final AjaxButton cancel = new AjaxButton("cancel.button",
> AreaEditorForm.this) {
>                                private static final long serialVersionUID = 1L;
>
>                                @Override
>                                protected void onSubmit(final AjaxRequestTarget target,
>                                                final Form<?> form) {
>                                        System.out.println("cancel.button AjaxButton.onSubmit(target)");
>                                        modal.close(target);
>                                }
>                        };
>                        cancel.setDefaultFormProcessing(false);
>                        add(cancel);
>
>                        add(new AjaxLink<Void>("cancel.link") {
>                                private static final long serialVersionUID = 1L;
>
>                                @Override
>                                public void onClick(final AjaxRequestTarget target) {
>                                        System.out.println("AjaxLink.onClick");
>                                        modal.close(target);
>                                }
>                        });
>                }
>
>                @Override
>                protected void delegateSubmit(final IFormSubmittingComponent
> submittingComponent) {
>                        System.out.println("Form.delegateSubmit");
>                        super.delegateSubmit(submittingComponent);
>                }
>
>                @Override
>                protected void onSubmit() {
>                        System.out.println("Form.onSubmit");
>                        super.onSubmit();
>                }
>
>        }
>
>
> For some reason, neither AjaxButton for cancel or submit can close the
> window. The AjaxLink can - and that works in my situation for 'cancelling'
> but I have to be able to close the window after a successful submission and
> that code is not working in the onSubmit handlers (of either button).
>
> Am I missing a wire?
>
> One other anomaly - I can see the screen flicker on each submission or
> cancel (ie: I can tell a request is hitting the server). But, regardless of
> submission or canceling button, validation ALWAYS occurs. Per the required
> fields in the form - canceling does not seem to skip the validation
> eventhough I've included: cancel.setDefaultFormProcessing(false);
>
> Another anomaly, "AjaxButton: A button that submits the form via ajax. Since
> this button takes the form as a constructor argument it does not need to be
> added to it unlike the Button component." .... but if I remove this line:
>
>    add(cancel);
>
> wicket complains "WicketMessage: Unable to find component with id
> 'cancel.button' ..."
>
> If I place data in the two fields and then click on cancel,
> "Form.delegateSubmit" logs to the console followed by "Form.onSubmit" ...
> but I don't initially see "cancel.button ..." log to the console. In fact, I
> click the cancel button 4 more times before I actually see it echo it's
> println to the console. It is odd. Then I don't see that line for 4 more
> trys ... and then it happens again. If I vary the pace, I can get it to show
> up unpredictably at different times.
>
> The docs also mention: "The default when there is a submitting
> IFormSubmittingComponent is to first call onSubmit on that Component," ...
> but I'm seeing the opposite here correct (assuming the button the submitting
> component).
>
> Here is a series of 15 clicks on the "Cancel" Button:
>
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> cancel.button AjaxButton.onSubmit(target)
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> cancel.button AjaxButton.onSubmit(target)
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> cancel.button AjaxButton.onSubmit(target)
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> cancel.button AjaxButton.onSubmit(target)
>
> And the same thing goes for the Submit button. Sometimes it echoes,
> sometimes it doesn't and it it never actually closes the window.
>
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> submit.button AjaxButton.onSubmit(target)
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> submit.button AjaxButton.onSubmit(target)
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> submit.button AjaxButton.onSubmit(target)
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> Form.delegateSubmit
> Form.onSubmit
> submit.button AjaxButton.onSubmit(target)
>
>
> HTML here:
>
>        <form class="standard" wicket:id="form">
>        <table class="top">
>        <tr>
>                <th>Name</th>
>                <td><input wicket:id="name" type="text" name="name" size="56"
> maxlength="80" value="abcd"></input></td>
>        </tr>
>        <tr>
>                <th>Summary</th>
>                <td><textarea wicket:id="summary" name="summary"
> rows="6">abcd</textarea></td>
>        </tr>
>        <tr>
>                <th>&nbsp;</th>
>                <td>
>                        <input wicket:id="submit.button" type="submit"
> wicket:message="value:Application.saveButton.label"/>
>                        <input wicket:id="cancel.button" type="submit"
> wicket:message="value:Application.cancelButton.label"/>
>                         # <wicket:message key="Application.cancelButton.label"/>
>                </td>
>        </tr>
>        </table>
>        </form>
>
>
> Any thoughts would be appreciated.
>
> -Luther
>
> --
> View this message in context: http://apache-wicket.1842946.n4.nabble.com/Cancelling-ala-AjaxLink-vs-AjaxButton-tp2717635p2718130.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

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


Re: Cancelling ala AjaxLink vs AjaxButton

Posted by LutherBaker <lu...@gmail.com>.
Thanks Igor, I've determined that something is not playing nicely here.

The larger picture is this - user visits a page and clicks on Add to add a
widget to the database. I pop up a ModalWindow with a form on it. User can
(a) submit form, (b) cancel button (c) cancel link.

I'd like to close the form on a successful submission or if the user clicks
on either 'cancel' option.

	private static class AreaEditorForm extends Form<Area> {
		private static final long serialVersionUID = 1L;

		public AreaEditorForm(final String id,
				final Area area,
				final ModalWindow modal) {
			super(id, new CompoundPropertyModel<Area>(area));
			final TextField<String> name = new TextField<String>("name");
			add(name);
			name.setRequired(true);
			name.add(new DefaultFocusBehavior());

			final TextArea<String> summary = new TextArea<String>("summary");
			summary.setRequired(true);
			add(summary);

			add(new AjaxButton("submit.button", AreaEditorForm.this) {
				private static final long serialVersionUID = 1L;

				@Override
				protected void onSubmit(final AjaxRequestTarget target,
						final Form<?> form) {
					System.out.println("submit.button AjaxButton.onSubmit(target)");
					modal.close(target);
				}
			});

			final AjaxButton cancel = new AjaxButton("cancel.button",
AreaEditorForm.this) {
				private static final long serialVersionUID = 1L;

				@Override
				protected void onSubmit(final AjaxRequestTarget target,
						final Form<?> form) {
					System.out.println("cancel.button AjaxButton.onSubmit(target)");
					modal.close(target);
				}
			};
			cancel.setDefaultFormProcessing(false);
			add(cancel);

			add(new AjaxLink<Void>("cancel.link") {
				private static final long serialVersionUID = 1L;

				@Override
				public void onClick(final AjaxRequestTarget target) {
					System.out.println("AjaxLink.onClick");
					modal.close(target);
				}
			});
		}

		@Override
		protected void delegateSubmit(final IFormSubmittingComponent
submittingComponent) {
			System.out.println("Form.delegateSubmit");
			super.delegateSubmit(submittingComponent);
		}

		@Override
		protected void onSubmit() {
			System.out.println("Form.onSubmit");
			super.onSubmit();
		}

	}


For some reason, neither AjaxButton for cancel or submit can close the
window. The AjaxLink can - and that works in my situation for 'cancelling'
but I have to be able to close the window after a successful submission and
that code is not working in the onSubmit handlers (of either button).

Am I missing a wire?

One other anomaly - I can see the screen flicker on each submission or
cancel (ie: I can tell a request is hitting the server). But, regardless of
submission or canceling button, validation ALWAYS occurs. Per the required
fields in the form - canceling does not seem to skip the validation
eventhough I've included: cancel.setDefaultFormProcessing(false);

Another anomaly, "AjaxButton: A button that submits the form via ajax. Since
this button takes the form as a constructor argument it does not need to be
added to it unlike the Button component." .... but if I remove this line:

    add(cancel);

wicket complains "WicketMessage: Unable to find component with id
'cancel.button' ..."

If I place data in the two fields and then click on cancel,
"Form.delegateSubmit" logs to the console followed by "Form.onSubmit" ...
but I don't initially see "cancel.button ..." log to the console. In fact, I
click the cancel button 4 more times before I actually see it echo it's
println to the console. It is odd. Then I don't see that line for 4 more
trys ... and then it happens again. If I vary the pace, I can get it to show
up unpredictably at different times.

The docs also mention: "The default when there is a submitting
IFormSubmittingComponent is to first call onSubmit on that Component," ...
but I'm seeing the opposite here correct (assuming the button the submitting
component).

Here is a series of 15 clicks on the "Cancel" Button:

Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
cancel.button AjaxButton.onSubmit(target)
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
cancel.button AjaxButton.onSubmit(target)
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
cancel.button AjaxButton.onSubmit(target)
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
cancel.button AjaxButton.onSubmit(target)

And the same thing goes for the Submit button. Sometimes it echoes,
sometimes it doesn't and it it never actually closes the window.

Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
submit.button AjaxButton.onSubmit(target)
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
submit.button AjaxButton.onSubmit(target)
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
submit.button AjaxButton.onSubmit(target)
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
Form.delegateSubmit
Form.onSubmit
submit.button AjaxButton.onSubmit(target)


HTML here:

    	<form class="standard" wicket:id="form">
    	<table class="top">
    	<tr>
    		<th>Name</th>
    		<td><input wicket:id="name" type="text" name="name" size="56"
maxlength="80" value="abcd"></input></td>
    	</tr>
    	<tr>
    		<th>Summary</th>
    		<td><textarea wicket:id="summary" name="summary"
rows="6">abcd</textarea></td>
    	</tr>
    	<tr>
    		<th>&nbsp;</th>
    		<td>
    			<input wicket:id="submit.button" type="submit"
wicket:message="value:Application.saveButton.label"/>
    			<input wicket:id="cancel.button" type="submit"
wicket:message="value:Application.cancelButton.label"/>
    			 # <wicket:message key="Application.cancelButton.label"/> 
    		</td>
    	</tr>
    	</table>
    	</form>


Any thoughts would be appreciated.

-Luther

-- 
View this message in context: http://apache-wicket.1842946.n4.nabble.com/Cancelling-ala-AjaxLink-vs-AjaxButton-tp2717635p2718130.html
Sent from the Users forum mailing list archive at Nabble.com.

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


Re: Cancelling ala AjaxLink vs AjaxButton

Posted by Igor Vaynberg <ig...@gmail.com>.
that should be enough, alternatively use AjaxLink instead

-igor

On Tue, Sep 28, 2010 at 10:49 AM, LutherBaker <lu...@gmail.com> wrote:
>
> I am popping up a ModalWindow with a form - which has Cancel and Submit
> buttons. Unfortunately, I can't get the Cancel button to close the window.
> It keeps submitting to the validator, stays on the form and echos validation
> text to the feedback panel.
>
> I can get it to work with an AjaxLink.
>
>
>    &lt;a href="#" wicket:id="cancel.link"&gt;&lt;wicket:message
> key="Application.cancelButton.label"/&gt;&lt;/a&gt;
>    &lt;input wicket:id="cancel.button" type="button"
> wicket:message="value:Application.cancelButton.label"/&gt;
>
>
>
>                        final AjaxLink cancelLink = new AjaxLink("cancel.link") {
>                                private static final long serialVersionUID = 1L;
>
>                                @Override
>                                public void onClick(final AjaxRequestTarget target) {
>                                        modal.close(target);
>                                }
>
>                        };
>                        add(cancelLink);
>
>                        final AjaxButton cancel = new AjaxButton("cancel.button",
> AreaEditorForm.this) {
>                                private static final long serialVersionUID = 1L;
>
>                                @Override
>                                protected void onSubmit(final AjaxRequestTarget target,
>                                                final Form<?> form) {
>                                        modal.close(target);
>                                }
>                        };
>                        cancel.setDefaultFormProcessing(false);
>                        add(cancel);
>
>
> I thought that I could set default form processing = false but that doesn't
> seem to be enough.
>
> Thoughts?
>
> -Luther
>
> --
> View this message in context: http://apache-wicket.1842946.n4.nabble.com/Cancelling-ala-AjaxLink-vs-AjaxButton-tp2717635p2717635.html
> Sent from the Users forum mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

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