You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by James Carman <ja...@carmanconsulting.com> on 2018/03/27 12:42:33 UTC

ListView Add/Remove via AJAX...

It has been a while since I've used Wicket and man, I really forgot how
much I love this framework! It may be that I'm rusty, but I've searched
quite a bit and tried all the suggestions I've found, but I can't seem to
make add/remove via AJAX work for a ListView while preserving the input
data. I am using Wicket 8.0.0-M9. Here's what I've done so far:

correctChoiceGroup = new CheckGroup<>("correctChoices",
Model.ofSet(Sets.newHashSet()));
correctChoiceGroup.setRequired(true);
correctChoiceGroup.setOutputMarkupId(true);
correctChoiceGroup.setRenderBodyOnly(false);

final IModel<List<String>> choicesModel = Model.ofList(new LinkedList<>());
choicesView = new ListView<String>("choices", choicesModel) {
    @Override
    protected void populateItem(ListItem<String> item) {
        final int index = item.getIndex();

        item.add(new TextField<>("field", item.getModel()));
        item.add(new Check<>("check", Model.of(index)));

        final AjaxSubmitLink deleteLink = new AjaxSubmitLink("deleteButton") {
            @Override
            @SuppressWarnings("unchecked")
            protected void onSubmit(AjaxRequestTarget target) {
                final ListView listView = findParent(ListView.class);
                listView.getModelObject().remove(index);
                listView.removeAll();
                target.add(correctChoiceGroup);
            }
        };
        deleteLink.setDefaultFormProcessing(false);
        item.add(deleteLink);
    }
}.setReuseItems(true);


correctChoiceGroup.add(choicesView);

add(new AjaxSubmitLink("addButton") {
    @Override
    protected void onSubmit(AjaxRequestTarget target) {
        choicesView.getModelObject().add("");
        choicesView.removeAll();
        target.add(correctChoiceGroup);
    }
}.setDefaultFormProcessing(false));

add(correctChoiceGroup);


When I click on the delete link (I have a similarly-implemented "add" link
outside of the ListView), all of the input data goes away, since I am
losing the original items from the removeAll() call.  Now, I am doing the
removeAll() to force Wicket to realize that I've changed the underlying
list, otherwise, the original items are reused and the it always looks like
the last item is removed.  I'm sure I'm just rusty, but I am banging my
head on this one.

Thanks,

James

Re: ListView Add/Remove via AJAX...

Posted by Ernesto Reinaldo Barreiro <re...@gmail.com>.
Hi James,

Welcome back... Still remember you from old times in list :-)

On Tue, Mar 27, 2018 at 2:42 PM, James Carman <ja...@carmanconsulting.com>
wrote:

> It has been a while since I've used Wicket and man, I really forgot how
> much I love this framework! It may be that I'm rusty, but I've searched
> quite a bit and tried all the suggestions I've found, but I can't seem to
> make add/remove via AJAX work for a ListView while preserving the input
> data. I am using Wicket 8.0.0-M9. Here's what I've done so far:
>
> correctChoiceGroup = new CheckGroup<>("correctChoices",
> Model.ofSet(Sets.newHashSet()));
> correctChoiceGroup.setRequired(true);
> correctChoiceGroup.setOutputMarkupId(true);
> correctChoiceGroup.setRenderBodyOnly(false);
>
> final IModel<List<String>> choicesModel = Model.ofList(new LinkedList<>());
> choicesView = new ListView<String>("choices", choicesModel) {
>     @Override
>     protected void populateItem(ListItem<String> item) {
>         final int index = item.getIndex();
>
>         item.add(new TextField<>("field", item.getModel()));
>         item.add(new Check<>("check", Model.of(index)));
>
>         final AjaxSubmitLink deleteLink = new
> AjaxSubmitLink("deleteButton") {
>             @Override
>             @SuppressWarnings("unchecked")
>             protected void onSubmit(AjaxRequestTarget target) {
>                 final ListView listView = findParent(ListView.class);
>                 listView.getModelObject().remove(index);
>                 listView.removeAll();
>                 target.add(correctChoiceGroup);
>             }
>         };
>         deleteLink.setDefaultFormProcessing(false);
>         item.add(deleteLink);
>     }
> }.setReuseItems(true);
>
>
> correctChoiceGroup.add(choicesView);
>
> add(new AjaxSubmitLink("addButton") {
>     @Override
>     protected void onSubmit(AjaxRequestTarget target) {
>         choicesView.getModelObject().add("");
>         choicesView.removeAll();
>         target.add(correctChoiceGroup);
>     }
> }.setDefaultFormProcessing(false));
>
> add(correctChoiceGroup);
>
>
> When I click on the delete link (I have a similarly-implemented "add" link
> outside of the ListView), all of the input data goes away, since I am
> losing the original items from the removeAll() call.  Now, I am doing the
> removeAll() to force Wicket to realize that I've changed the underlying
> list, otherwise, the original items are reused and the it always looks like
> the last item is removed.  I'm sure I'm just rusty, but I am banging my
> head on this one.
>
> Thanks,
>
> James
>



-- 
Regards - Ernesto Reinaldo Barreiro

Re: ListView Add/Remove via AJAX...

Posted by Carl-Eric Menzel <cm...@wicketbuch.de>.
Hi James,

Some time ago I wrote this:

https://github.com/duesenklipper/wicket-appendablerepeater

It should work with forms. If not, let me know.

Best regards
Carl-Eric

On 27.03.2018 14:42, James Carman wrote:
> It has been a while since I've used Wicket and man, I really forgot how
> much I love this framework! It may be that I'm rusty, but I've searched
> quite a bit and tried all the suggestions I've found, but I can't seem to
> make add/remove via AJAX work for a ListView while preserving the input
> data. I am using Wicket 8.0.0-M9. Here's what I've done so far:
> 
> correctChoiceGroup = new CheckGroup<>("correctChoices",
> Model.ofSet(Sets.newHashSet()));
> correctChoiceGroup.setRequired(true);
> correctChoiceGroup.setOutputMarkupId(true);
> correctChoiceGroup.setRenderBodyOnly(false);
> 
> final IModel<List<String>> choicesModel = Model.ofList(new LinkedList<>());
> choicesView = new ListView<String>("choices", choicesModel) {
>      @Override
>      protected void populateItem(ListItem<String> item) {
>          final int index = item.getIndex();
> 
>          item.add(new TextField<>("field", item.getModel()));
>          item.add(new Check<>("check", Model.of(index)));
> 
>          final AjaxSubmitLink deleteLink = new AjaxSubmitLink("deleteButton") {
>              @Override
>              @SuppressWarnings("unchecked")
>              protected void onSubmit(AjaxRequestTarget target) {
>                  final ListView listView = findParent(ListView.class);
>                  listView.getModelObject().remove(index);
>                  listView.removeAll();
>                  target.add(correctChoiceGroup);
>              }
>          };
>          deleteLink.setDefaultFormProcessing(false);
>          item.add(deleteLink);
>      }
> }.setReuseItems(true);
> 
> 
> correctChoiceGroup.add(choicesView);
> 
> add(new AjaxSubmitLink("addButton") {
>      @Override
>      protected void onSubmit(AjaxRequestTarget target) {
>          choicesView.getModelObject().add("");
>          choicesView.removeAll();
>          target.add(correctChoiceGroup);
>      }
> }.setDefaultFormProcessing(false));
> 
> add(correctChoiceGroup);
> 
> 
> When I click on the delete link (I have a similarly-implemented "add" link
> outside of the ListView), all of the input data goes away, since I am
> losing the original items from the removeAll() call.  Now, I am doing the
> removeAll() to force Wicket to realize that I've changed the underlying
> list, otherwise, the original items are reused and the it always looks like
> the last item is removed.  I'm sure I'm just rusty, but I am banging my
> head on this one.
> 
> Thanks,
> 
> James
> 

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


Re: ListView Add/Remove via AJAX...

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

The best explanation for adding items via Ajax you could read at
http://wicketinaction.com/2008/10/repainting-only-newly-created-repeater-items-via-ajax/
Removing an item should be easier if the ListItems have id.

On Tue, Mar 27, 2018 at 3:42 PM, James Carman <ja...@carmanconsulting.com>
wrote:

> It has been a while since I've used Wicket and man, I really forgot how
> much I love this framework! It may be that I'm rusty, but I've searched
> quite a bit and tried all the suggestions I've found, but I can't seem to
> make add/remove via AJAX work for a ListView while preserving the input
> data. I am using Wicket 8.0.0-M9. Here's what I've done so far:
>
> correctChoiceGroup = new CheckGroup<>("correctChoices",
> Model.ofSet(Sets.newHashSet()));
> correctChoiceGroup.setRequired(true);
> correctChoiceGroup.setOutputMarkupId(true);
> correctChoiceGroup.setRenderBodyOnly(false);
>
> final IModel<List<String>> choicesModel = Model.ofList(new LinkedList<>());
> choicesView = new ListView<String>("choices", choicesModel) {
>     @Override
>     protected void populateItem(ListItem<String> item) {
>         final int index = item.getIndex();
>
>         item.add(new TextField<>("field", item.getModel()));
>         item.add(new Check<>("check", Model.of(index)));
>
>         final AjaxSubmitLink deleteLink = new
> AjaxSubmitLink("deleteButton") {
>             @Override
>             @SuppressWarnings("unchecked")
>             protected void onSubmit(AjaxRequestTarget target) {
>                 final ListView listView = findParent(ListView.class);
>                 listView.getModelObject().remove(index);
>                 listView.removeAll();
>                 target.add(correctChoiceGroup);
>             }
>         };
>         deleteLink.setDefaultFormProcessing(false);
>         item.add(deleteLink);
>     }
> }.setReuseItems(true);
>
>
> correctChoiceGroup.add(choicesView);
>
> add(new AjaxSubmitLink("addButton") {
>     @Override
>     protected void onSubmit(AjaxRequestTarget target) {
>         choicesView.getModelObject().add("");
>         choicesView.removeAll();
>         target.add(correctChoiceGroup);
>     }
> }.setDefaultFormProcessing(false));
>
> add(correctChoiceGroup);
>
>
> When I click on the delete link (I have a similarly-implemented "add" link
> outside of the ListView), all of the input data goes away, since I am
> losing the original items from the removeAll() call.  Now, I am doing the
> removeAll() to force Wicket to realize that I've changed the underlying
> list, otherwise, the original items are reused and the it always looks like
> the last item is removed.  I'm sure I'm just rusty, but I am banging my
> head on this one.
>
> Thanks,
>
> James
>