Wicket - Disable/enable Textfield using Checkbox

Question

Wicket - Disable/enable Textfield using Checkbox

1.7k Views Asked by Spandana At 04 April 2025 at 19:35

UserPage.java

public class UserPage extends WebPage {

public UserPage(final PageParameters parameters) {

    final CheckBox chk0 = new CheckBox("chk", Model.of(Boolean.FALSE));

    add(new FeedbackPanel("feedback"));

    final TextField<String> username = new TextField<String>("username", Model.of(""));
    username.setRequired(true);
    username.add(new UsernameValidator());


    final TextField<String> user = new TextField<String>("user", Model.of(""));
    user.setRequired(true);
    user.add(new UsernameValidator());

     user.add(AttributeModifier.replace("readonly", "readonly")); //Disabled Text Field

    Form<?> form = new Form<Void>("userForm") {

        @Override
        protected void onSubmit() {

            final String usernameValue = username.getModelObject();

            PageParameters pageParameters = new PageParameters();
            pageParameters.add("username", usernameValue);
            setResponsePage(SuccessPage.class, pageParameters);

        }
    };
    add(form);
    form.add(username);
    form.add(chk0);
    form.add(user);

UserPage.html

 <div wicket:id="feedback"></div>
 <form wicket:id="userForm">
    <input type="checkbox" wicket:id="chk" />
    <p>
        <label>Username</label>: <input wicket:id="username" type="text"
            size="20" />

            <input wicket:id="user" type="text"
            size="20" />                
    </p>
    <input type="submit" value="Register" />
   </form>

I have 2 text fields.."username" and "user". username is Enabled Textfield and user is Disabled Textfield.

But I need to Disable/Enable Textfield on click of Checkbox in JAVA. How to implement this? I am just a beginner.Any help would be appreciated.Thankyou.

Original Q&A

There are 1 best solutions below

**roby** · Accepted Answer

I'm using wicket 7.5

To make a click on your checkbox trigger an http request from the browser to wicket, update some state and re-render part of your page you should either add an AjaxBehavior to the CheckBox or use the convenience class AjaxCheckBox (which adds the AjaxBehavior for you).

I've trimmed down your example a little just to show how you could use the checkbox to enable/disable one of your text fields with a roundtrip to wicket.

markup

<!DOCTYPE html>
<html xmlns:wicket="http://wicket.apache.org">
  <body>
    <input type="checkbox" wicket:id="chk" />
    <p>
      <label>Username</label>:<input wicket:id="username" type="text" size="20" />
    </p>
  </body>
</html>

AjaxCheckBox

final Model<Boolean> checkboxModel = Model.of(false);
final TextField<String> username = new TextField<String>("username", Model.of("")){
    @Override
    public boolean isEnabled() {
        return !checkboxModel.getObject();
    }
};
//instruct wicket to write an id on the html element so it can replace it via javascript
username.setOutputMarkupId(true);
username.setRequired(true);
//AjaxCheckBox is 'A CheckBox which is updated via ajax when the user changes its value'
final CheckBox chk0 = new AjaxCheckBox("chk", checkboxModel) {
    @Override
    protected void onUpdate(AjaxRequestTarget target) {
        //re-render the username textfield
        target.add(username);
    }
};
add(username, chk0);

And here's an example using a behaviour instead of a convenience class.

AjaxBehavior

public HomePage(final PageParameters parameters) {
    final Model<Boolean> checkboxModel = Model.of(false);
    final TextField<String> username = new TextField<String>("username", Model.of("")){
        @Override
        public boolean isEnabled() {
            return !checkboxModel.getObject();
        }
    };
    //instruct wicket to write an id on the html element so it can replace it via javascript
    username.setOutputMarkupId(true);
    username.setRequired(true);
    final CheckBox chk0 = new CheckBox("chk", checkboxModel);
    chk0.setOutputMarkupId(true);
    updateOnClick(chk0, username);
    add(username, chk0);
}

static void updateOnClick(Component a, final Component b){
    a.add(new AjaxFormComponentUpdatingBehavior("click"){

        @Override
        protected void onUpdate(AjaxRequestTarget target) {
            target.add(b);
        }
    });
}

Wicket - Disable/enable Textfield using Checkbox

There are 1 best solutions below

markup

AjaxCheckBox

AjaxBehavior

Related Questions in JAVA

Related Questions in CHECKBOX

Related Questions in WICKET

Trending Questions

Popular # Hahtags

Popular Questions