Wicket behaviors to the rescue again !

Scenario :

In my application , pages showing information about an item in the form of a table is common. These tables include checkboxes for selecting the individual items – for tracking the items for any operation like deleting.

Assume that a user selects some checkboxes to perform the delete operation. Before the server request is sent, user is prompted by a javascript alert if he wishes to change his mind.

This is where the javascript cancel comes in and this is where the magic of wicket behaviors come in to save my day.

The issue:  To uncheck the checkboxes checked after the user clicks cancel in Javascript confirm window.

In my earlier blogs, I have mentioned how useful behaviors can be.Behaviors are wonderful things in wicket.
Not only can a wicket component receive a request (via a listener),but So CAN WICKET BEHAVIORS !!!

I will use the above concept to fix the above mentioned problem:
NOTE: before proceeding I would like to mention that there is more than one approach to fix a problem like this. BUT the important thing to remember is that , during the request sent after clicking the javascript cancel button , the data provider should not be fired again. This will happen if form containing the table is attached again.

So any solution should take care that of the above fact.In the solution I attempt here , I ensure that provider does not run again

Here the code
Step 1:

We need to store the mark up ids of checkboxes top uncheck later…

List <Long> toDeleteItems = new ArrayList<Long>();

List< String> toDeleteItemsMarkupIds = new ArrayList<String>();

Step 2 : Have a checkgroup in your page. The checkgroup here can be useful not just to support this solution , but also to act as a container to checkboxes for selecting/de-selecting all. Here it is there just to support the solution.

CheckGroup group = new CheckGroup(“group”,new Model());group.setOutputMarkUpId(true);

Step 3: Write the ajax behavior – this is where the magic happens.

AbstractDefaultAjaxBehvior resetBehavior = new AbstractDefaultAjaxBehvior (){ public void respond(AjaxRequestTarget target) { /*** First clear the item ids to delete ***/ toDeleteItems.clear(); /*** Then add javascript to uncheck the checkboxes in the UI ***/ for(int z=0; z< toDeleteItemsMarkupIds.size();z++){ String js = "element=document.getElementById(‘"+toDeleteItemsMarkupIds.get(z)+"');"; js=js + "element.checked = false;"; target.appendJavascript(js); } } }

Step 4: Get the url to invoke:

group.add(resetBehavior);

/** Get the url to the behavior ***/

String cancelUrl = resetBehavior.getCallbackUrl(true false);

Now, a bit of stuff from wicket-ajax.js script

String fullUrl =”wicketAjaxGet(\’”+url+”\’, function() {} , function() {})”;

The above is required so that wicket can make an ajax request and the page wont change – just the checkboxes will be affected.
NOTE: window.location = url ; will not work as the browser will change the url to the behavior url which only sends back the checked status of some checkboxes and the page will then be lost.

Step 5 : Final step -:)

The delete button needs to have its onclick behavior modified slightly

Link deleteLink = ….

deleteLink.add(new SimpleAttributeModiefier(“onclick”,

“var v = confirm(‘Do you want to delete’) ;”+

“if(v == false) { fullUrl }” +

“return v;” ));