Anita
Anita

Reputation: 11

how to access html element which doesn't have a wicket:id

I am new to wicket ,Please someone help me with a thought. I have a logic around a checkbox to display or not to display. Problem: when the logic of not to display a checkbox is on , which is by adding a display:none to the checkbox element dynamcially in code , there is a white space because of td surronding the checkbox.

my html looks like

<span wicket:id="checkgroup">
<table>
<tr wicket:id="srow" >
<td><input type="checkbox" wicket:id="scheck"/></td>
<td><img wicket:id="sicon"></img></td>
</tr>
</table>
</span>

so in code I have if else logic for adding a display:none to check box element which removes the checkbox from the view which looks like the below

<span wicket:id="checkgroup">
<table>
<tr wicket:id="srow" >
<td><input type="checkbox" wicket:id="scheck" style="display:none"/></td>
<td><img wicket:id="sicon"></img></td>
</tr>
</table>
</span>                     

final CheckGroup<Scope> checkGroup = new CheckGroup<>("checkGroup", 
new ArrayList<> ());    
ListView<Scope> listView = new ListView<Scope>
("srow", sList); 
@Override
protected void populateItem(final ListItem<S> item)
{
  Check<S> check = new Check<>("scheck", item.getModel(), checkGroup);
  if(defaultscope)
  {
     check.add(new AttributeModifier("style","display:none"));
  }
  item.add(check);
} 

so now my checkbox disappears but the surrounding td stays and causing a white space in display.

Any ideas on how to approach this issue.

Thanks.

Upvotes: 1

Views: 292

Answers (1)

thg
thg

Reputation: 1235

You can use <wicket:enclosure> to remove html if the referenced child is not present. wicket enclosure.

Your code in populateItem could look like this:

Check<S> check = new Check<>("scheck", item.getModel(), checkGroup);
  if(defaultscope)
  {
     check.setVisible(false);
  }
  item.add(check);

Your markup would look like this:

<tr wicket:id="srow" >
<wicket:enclosure>
  <td><input type="checkbox" wicket:id="scheck"/></td>
</wicket:enclosure>
<td><img wicket:id="sicon"></img></td>
</tr> 

Upvotes: 2

Related Questions