wicketwicket-7

Wicket: Create control that swaps between a TextBox and a Label


I have a Panel that has an edit state and a view state. I need a control that swaps between TextField and Label based on the Panel's state. For example, in edit state the Panel would display as a TextField and the same field would display as a Label in view state.

This is very similar to the AjaxEditableLabel, but it is not the same. I am changing multiple Labels in my Form into TextFields at the same time.

In addition to swapping controls, I would like to continue to take advantage of wicket:for. Here is a proposed markup example:

<label wicket:for="firstNm"><wicket:message key="firstNm" /></label><br />
<span wicket:id="firstNm"></span>

I would like to be able to continue to add HTML attributes to the TextField. It would be possible to copy them from the span tag in onComponentTag. For example:

<span wicket:id="firstNm" maxlength="30"></span>

... could render the following in edit mode:

<input type="text" maxlength="30" />

I have also looked at the ViewOrEdit control in visural-wicket, but I don’t think it will work with wicket:for.


Solution

  • You can do this by using Wicket Fragment container. Define two fragments in the markup, for the input and the span respectively. In the Java code add Fragment with different second parameter depending on your conditions. The TextField and the Label should share the same model to show the same text.