Revision history [back]

I ended up adding a javascript listener to avoid server call. My custom textarea component contains a textarea and 2 labels in a hlayout.

<textbox id="content" multiline="true" rows="3" />
<hlayout id="textareaCounter" sclass="textarea-counter">
    <label id="counter" />
    <label id="remaining" />
</hlayout>

In java, I initiate the remaining when setting maxLength with :

 remaining.setValue(Labels.getLabel("field.textarea.counter", new Object[] { maxLength }));

The label being :

field.textarea.counter= character(s) / {0} remaining

And by default and on setValue, I update the counter label.

Then I add a listener on the widget size :

content.setWidgetListener(Events.ON_CHANGING, "this.nextSibling.firstChild.setValue(event.data.value.length)");

I ended up adding a javascript listener to avoid server call. My custom textarea component contains a textarea and 2 labels in a hlayout.

<textbox id="content" multiline="true" rows="3" />
<hlayout id="textareaCounter" sclass="textarea-counter">
    <label id="counter" />
    <label id="remaining" />
</hlayout>

In java, I initiate the remaining when setting maxLength with :

 remaining.setValue(Labels.getLabel("field.textarea.counter", new Object[] { maxLength }));

The label being :

field.textarea.counter= character(s) / {0} remaining

And by default and on setValue, I update the counter label.

counter.setValue(String.valueOf(StringUtils.defaultString(value).length()));

Then I add a listener on the widget size :

content.setWidgetListener(Events.ON_CHANGING, "this.nextSibling.firstChild.setValue(event.data.value.length)");