wicket 6.0.0-beta2 Updating content of DataTable when submitting a form with AjaxButton

Question

I want to change the content of a DataTable depending on the content of a form (think of it as a searchbar functionality). I used to do that in wicket 1.5.x but I can not seem to make it work in wicket 6.0.0-beta2. It does not seem to enter in the onSubmit method of the AjaxButton. Everything else works just fine, every components render correctly and the dataTable is filled with the correct data when the page load, but when I click the button, nothing happens.

Any help would be greatly appreciated. Here is what my code look like :

The dataTable :

public SubscriberPage(PageParameters parameters) { 
super(parameters); 
add(new SearchForm("searchForm")); 

List<IColumn<Subscriber, String>> columns = new ArrayList<IColumn<Subscriber, String>>(); 
columns.add(new PropertyColumn<Subscriber, String>(new Model<String>("Telephone Number"), 
                                                   "tn", 
                                                   "tn")); 
[...] 
columns.add(new PropertyColumn<Subscriber, String>(new Model<String>("Initialized MB"), 
                                                   "initializedMB")); 

table = new AjaxFallbackDefaultDataTable<Subscriber, String>("table", 
                                                             columns, 
                                                             subscriberDataProvider, 
                                                             40); 
table.setOutputMarkupId(true); 
add(table); 
} 

and here is the form with the AjaxButton:

private class SearchForm extends Form<String> { 
private static final long serialVersionUID = 1L; 

private String tnModel; 
private Label tnLabel = new Label("tnLabel", "Telephone Number :"); 
private TextField<String> tn; 

public SearchForm(String id) { 
  super(id); 
  tn = new TextField<String>("tnTextField", new PropertyModel<String>(this, "tnModel")); 
  tn.setOutputMarkupId(true); 
  add(tnLabel); 
  add(tn); 

  AjaxButton lSearchButton = new AjaxButton("searchButton") { 
    private static final long serialVersionUID = 1L; 

    @Override 
    protected void onSubmit(AjaxRequestTarget target, Form<?> form) { 
      SubscriberFilter filter = new SubscriberFilter(); 
      target.add(table); 
      if (!(tn.getValue() == null) && !tn.getValue().isEmpty()) { 
        filter.setTn(tn.getValue()); 
      } 
      // giving the new filter to the dataProvider 
      subscriberDataProvider.setFilterState(filter); 
    } 

    @Override 
    protected void onError(AjaxRequestTarget target, Form<?> form) { 
      // TODO Implement onError(..) 
      throw new UnsupportedOperationException("Not yet implemented."); 
    } 

  }; 
  lSearchButton.setOutputMarkupId(true); 
  this.setDefaultButton(lSearchButton); 
  add(lSearchButton); 
} 
} 

Deanery

Did you test if you reach the onSubmit()? Via debug message or debugger? – Insincerity

Yes, as I said in my question, it's not reaching the onSubmit() and i don't know why... – Deanery

Could it be that this ticket is related: issues.apache.org/jira/browse/WICKET-4630 ? (On a side note: you know that there is 6.0.0beta-3 available?) – Sunderland

I don't think it is related to this ticket as it seems to be a problem with the ajax call not being executed. There is probably a some parameters I don't set correctly for the ajax call (maybe in the updateAjaxAttributes() that is mentionned in this page: cwiki.apache.org/confluence/display/WICKET/Wicket+Ajax). For now i stopped using wicket 6.x and went back to 1.5.x and everything is working just fine. The beta3 is worth a try though (thanks for the info) – Deanery

How does the form get the table? You are not passing it and table is not final in the upper code sample – Ballflower

Answer 1

The components that you want to refresh need to be added in a container. When you submit, the container needs to be added to target. This way your components will be refreshed. Something like:

WebMarkupContainer outputContainer = new WebMarkupContainer("searchResult");
outputContainer.setOutputMarkupId(true);
outputContainer.add(table);
add(outputContainer);

@Override
protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
    //change table ..... stuff ..... ...

    //refresh container
    target.add(outputContainer);
}


<div wicket:id="searchResult"></div>

Shipmate