How to set a button enabled=false after clicking on it in Wicket?

Question

What I want:

• if I click on a button, it should be NOT enabled (not clickable) BEFORE the other methods (in the clicking) would finish, only AFTER the methods' end.

Here is my code to the button:

@Override
protected void onInitialize() {
    add(createOkLink());
}

private IndicatingAjaxLink<Void> createOkLink() {
    final IndicatingAjaxLink<Void> ret = new IndicatingAjaxLink<Void>("okLink") {
        private static final long serialVersionUID = 1L;
        @Override
        public void onClick(AjaxRequestTarget target) {
            //when I click on it, this button (link) should not be enabled while the rest of the methods are not finished.
            method1(); //about 2-5 seconds running time
            method2(); //about 2-5 seconds running time
            method3(); //about 2-5 seconds running time
            feedback.success("success");
            target.add(feedback);
            //after every method has finished, the button should be clickable againg
        }
    };
    ret.setOutputMarkupId(true);
    return ret;
}

I hope someone can help me!

I am using Wicket 6.

Alethaalethea

Answer 1

    final Form<?> form = new Form<>("form");
    form.setOutputMarkupId(true).setOutputMarkupPlaceholderTag(true);
    add(form
        .add(new FeedbackPanel("feedback"))
        .add(new AjaxButton("button") {
            @Override
            protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
                info(System.currentTimeMillis());
                target.add(form);
                try {
                    TimeUnit.SECONDS.sleep(1);
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
            }
            @Override
            protected void updateAjaxAttributes(AjaxRequestAttributes attributes) {
                super.updateAjaxAttributes(attributes);
                attributes.getAjaxCallListeners().add(new AjaxCallListener()
                    .onBefore("$('#" + getMarkupId() + "').prop('disabled',true);")
                    .onComplete("$('#" + getMarkupId() + "').prop('disabled',false);"));
            }
        }));

Replevin

Nice. I haven't seen this onBefore and onComplete before, but they look very useful! – Counterweight

There are hooks to add your javascript calls on many other ajax events: onSuccess() (only if it succeeds), onFailure() (only if it fails), onPrecondition() (prevents the ajax request to be sent if it returns true, often used to implement a confirm('Are you sure?') before an action). – Replevin