4

I have the following html:

<label wicket:id="drugSearchResult.row.item.label" for="drug_1">[Drug XYZ]  
    <span wicket:id="drugSearchResult.row.item.info">[Information, Price, Other]</span>
</label>

But label element are not allowed to add a child component. Is there any way to achieve this html requirement?

This is the designer's requirement:

Drug XYZ // label
Information, Price, Other // span

cobeete
  • 169
  • 1
  • 3
  • 11
  • Why would you want to do that? What is that you want to achive? Put the resulting html that you want to get and what your model objects are. – Pablo Lascano Jun 14 '12 at 16:25
  • I really don't understand why would you do that, why don't you simply do `[Information, Price, Other]` – Pablo Lascano Jun 14 '12 at 16:49

2 Answers2

8

Make sure you're using FormComponentLabel for the <label> element instead of Label.

Label's purpose is to output text inside the associated element (it can be a <span>, <div> or almost any other tag).

FormComponentLabel's purpose is to model <label> tags. They receive the FormComponent they're related to and automatically output the for attribute with the proper value for the dom id attribute.

Take a look at the Wicket wiki page on Form control labels. They're adding components to FormComponentLabel there.

If you'd like to avoid using FormComponentLabel at all, you shouldn't be giving it a wicket:id attribute, and manually set the DOM id attribute of the element the <label> is going to refer to. Then just use it in the for attribute of the <label>.

For instance:

HTML

<input wicket:id="drug">
<label for="drug_1">[Drug XYZ]  
    <span wicket:id="drugSearchResult.row.item.info">[Information, Price, Other]</span>
</label>

Java

TextField drug = new TextField("drug");
drug.setMarkupId("drug_1"); // Make sure this ID is unique in the page!
drug.setOutputMarkupId(true);
add(drug);
Label drugDescription = new Label("drugSearchResult.row.item.label", aModel);
add(drugDescription);
JimHawkins
  • 4,843
  • 8
  • 35
  • 55
Xavi López
  • 27,550
  • 11
  • 97
  • 161
  • Thanks, never known about the FormComponentLabel. But it does get rather verbatim. – bert Jun 15 '12 at 08:22
  • 1
    @bert it might be, but is also quite useful. You can even output required field symbols (i.e. `*`) in the label automatically based on `isRequired()`, and use the component's `get/setLabel()` for the text :) – Xavi López Jun 15 '12 at 08:35
  • I have a usecase for this right now, so its good I stumble over this. Does the label text is i18n (i.e. loads from reasource files)? – bert Jun 15 '12 at 08:50
  • 1
    yeah, indeed! [`setLabel`](http://wicket.apache.org/apidocs/1.4/org/apache/wicket/markup/html/form/FormComponent.html#setLabel(org.apache.wicket.model.IModel)) receives a `Model`, so `StringResourceModel` would be fine here. This way you can always match the field name validators output in their errors with the text inside the ` – Xavi López Jun 15 '12 at 08:54
  • we use wicket:message right now, but have the requirement to include error markup. so this comes handy ;) – bert Jun 15 '12 at 09:30
1

Using properties and <wicket:message>

For me, the approach below is useful.
In my project, I have only one location per page where the text for the <label>s and validation messages is defined. It's the properties file of the web page.

The additional <div>s and their class attributes are from Bootstrap.

<div class="form-group required">
    <label wicket:for="customer.name1">
        <wicket:message key="customer.name1"/>
    </label>
    <div class="controls">
        <input type="text" wicket:id="customer.name1" required class="form-control">
    </div>
</div>

Java

add(new RequiredTextField<String>("customer.name1")
         .setLabel(new StringResourceModel("customer.name1")));

customerPage.properties

# siehe wicket-core-7.9.0-sources.jar!/org/apache/wicket/Application_de.properties
Required='${label}' ist erforderlich
customer.name1=Name 1
customer.name2=Name 2
customer.department=Abteilung
customer.phone=Telefon
customer.active=aktiv
JimHawkins
  • 4,843
  • 8
  • 35
  • 55