You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Thorsten Schöning <ts...@am-soft.de> on 2015/04/01 10:07:17 UTC

Handle form with multiple dynamic lines of the same input

Hi all,

I have a form currently only consisting of one "line" of inputs, like
the following:

> label1 input1 label2 input2
> label3 input3 label4 input4
> label5 input5

All those three lines form one logical line of input from the form's
perspective. What I would like to add is the ability for the user to
add and remove lines on demand with simple JS just cloning a current
line. The result should be something like the following:

> label1 input1 label2 input2
> label3 input3 label4 input4
> label5 input5

> label1.2 input1.2 label2.2 input2.2
> label3.2 input3.2 label4.2 input4.2
> label5.2 input5.2

> label1.3 input1.3 label2.3 input2.3
> label3.3 input3.3 label4.3 input4.3
> label5.3 input5.3

The interesting part now is with Wicket, because the form submitted
may 1. have an unknown amount of lines and 2. the lines may change
during submits because during validation Wicket may find input errors,
shows the form again and a user decides to resolve such errors by just
removing some lines of input and such.

Do you have any hints an what would be the best approach implementing
this in Wicket?

I obviously need some buttons or such for the user to add and remove
lines, so I thought of adding some Ajax behavior to send the fact of
the added/removed line with some sort of ID or index to Wicket, which
will then create/remove corresponding models and components in a map
or list of the current form instance.

Is there any approach without such an Ajax call by just parsing the
request fields into some list or such? All my inputs follow a known
naming convention. Something like getInputAsArray on a global form
level instead of per component?

And last, how would I need to render the form in case of validation
errors? The form always starts with only one input line but may need
to be rendered with 3 or 10 or whatever in case of errors.

Thanks for your valuable input!

Mit freundlichen Grüßen,

Thorsten Schöning

-- 
Thorsten Schöning       E-Mail: Thorsten.Schoening@AM-SoFT.de
AM-SoFT IT-Systeme      http://www.AM-SoFT.de/

Telefon...........05151-  9468- 55
Fax...............05151-  9468- 88
Mobil..............0178-8 9468- 04

AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln
AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow


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


Re: Handle form with multiple dynamic lines of the same input

Posted by Martin Grigorov <mg...@apache.org>.
Hi,

Take a look at these two articles:
-
http://wicketinaction.com/2008/10/repainting-only-newly-created-repeater-items-via-ajax/
- http://wicketinaction.com/2008/10/building-a-listeditor-form-component/

This is if you want to use Wicket's Form component.

If you are OK to process the submit "manually" then you can generate the
form fields on the client side with JS and submit against a page or even an
IResource.

Martin Grigorov
Freelancer, available for hire!
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Wed, Apr 1, 2015 at 11:07 AM, Thorsten Schöning <ts...@am-soft.de>
wrote:

> Hi all,
>
> I have a form currently only consisting of one "line" of inputs, like
> the following:
>
> > label1 input1 label2 input2
> > label3 input3 label4 input4
> > label5 input5
>
> All those three lines form one logical line of input from the form's
> perspective. What I would like to add is the ability for the user to
> add and remove lines on demand with simple JS just cloning a current
> line. The result should be something like the following:
>
> > label1 input1 label2 input2
> > label3 input3 label4 input4
> > label5 input5
>
> > label1.2 input1.2 label2.2 input2.2
> > label3.2 input3.2 label4.2 input4.2
> > label5.2 input5.2
>
> > label1.3 input1.3 label2.3 input2.3
> > label3.3 input3.3 label4.3 input4.3
> > label5.3 input5.3
>
> The interesting part now is with Wicket, because the form submitted
> may 1. have an unknown amount of lines and 2. the lines may change
> during submits because during validation Wicket may find input errors,
> shows the form again and a user decides to resolve such errors by just
> removing some lines of input and such.
>
> Do you have any hints an what would be the best approach implementing
> this in Wicket?
>
> I obviously need some buttons or such for the user to add and remove
> lines, so I thought of adding some Ajax behavior to send the fact of
> the added/removed line with some sort of ID or index to Wicket, which
> will then create/remove corresponding models and components in a map
> or list of the current form instance.
>
> Is there any approach without such an Ajax call by just parsing the
> request fields into some list or such? All my inputs follow a known
> naming convention. Something like getInputAsArray on a global form
> level instead of per component?
>
> And last, how would I need to render the form in case of validation
> errors? The form always starts with only one input line but may need
> to be rendered with 3 or 10 or whatever in case of errors.
>
> Thanks for your valuable input!
>
> Mit freundlichen Grüßen,
>
> Thorsten Schöning
>
> --
> Thorsten Schöning       E-Mail: Thorsten.Schoening@AM-SoFT.de
> AM-SoFT IT-Systeme      http://www.AM-SoFT.de/
>
> Telefon...........05151-  9468- 55
> Fax...............05151-  9468- 88
> Mobil..............0178-8 9468- 04
>
> AM-SoFT GmbH IT-Systeme, Brandenburger Str. 7c, 31789 Hameln
> AG Hannover HRB 207 694 - Geschäftsführer: Andreas Muchow
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>