CODEWITHSUNDEEP
javascriptjavaajaxwicket
Matteo Rossi
Matteo Rossi

Reputation: 105

Wicket Call Javascript Function Inside AjaxRequestTarget

I have a web application that uses Wicket. My problem is the following: I have a part of code that runs inside an AjaxRequestTarget that spend a long time, and I have the necessity to show during this operation a busy indicator, in order to show to the user that we are trying to process the request.

I try to use target.appendJavascript("jsfunction()") but it doesn't work, because it is fired after the execution of the method. How can I accomplish this goal?

My example code is the following

    final ConfirmModal del_modal = new ConfirmModal("del-btn", "Are you sure?") {
        @Override
        public void onClickOK(AjaxRequestTarget target) {

            target.appendJavaScript("loadingFormFromTarget();");

            try {
                Thread.sleep(10000);
            } catch (InterruptedException ex) {
                Logger.getLogger(ListPricePlanPage.class.getName()).log(Level.SEVERE, null, ex);
            }}}

UPDATE

The solution provided by martin-g works fine with AjaxLink, but my problem is more complex. I have a ConfirmModal that extends ModalWindo, with this implementation public abstract class ConfirmModalPanel extends Panel {

public ConfirmModalPanel(String id, String text) {
    super(id);

    add(new Label("text", text));

    AjaxLink ok = new AjaxLink("ok") {
        @Override
        public void onClick(AjaxRequestTarget target) {
            onClikOK(target);
        }

        @Override
        protected void updateAjaxAttributes(AjaxRequestAttributes attributes) {
            super.updateAjaxAttributes(attributes);
            attributes.getAjaxCallListeners().add(new AjaxCallListener().onBeforeSend("start();").onComplete("finish();"));
        }
    };



    add(ok);

    add(new AjaxLink("ko") {
        @Override
        public void onClick(AjaxRequestTarget target
        ) {
            onClikKO(target);
        }
    }
    );



}

abstract public void onClikOK(AjaxRequestTarget target);

abstract public void onClikKO(AjaxRequestTarget target
);

}

The functions "start()" and "finish()" are called correctly, but the execution of the request write inside the onClickOK method continue, and I cannot show the busy indicator.

Upvotes: 0

Views: 1571

Answers (1)

martin-g
martin-g

Reputation: 17533

Doing this in onClickOk() is too late. Anything written to the web response will be send to the browser once the request is finished.

You need to use AjaxCallListener#onBeforeSend() and onComplete(). Those are executed on the client side just before making the request and after receiving the response.

See https://github.com/l0rdn1kk0n/wicket-bootstrap/blob/73a3d62a17c12cbca60d6b54caeee6b99ffbe9a8/bootstrap-extensions/src/main/java/de/agilecoders/wicket/extensions/markup/html/bootstrap/ladda/LaddaAjaxLink.java#L101 and https://github.com/l0rdn1kk0n/wicket-bootstrap/blob/73a3d62a17c12cbca60d6b54caeee6b99ffbe9a8/bootstrap-extensions/src/main/java/de/agilecoders/wicket/extensions/markup/html/bootstrap/ladda/LaddaAjaxCallListener.java#L15-L16 for examples.

Upvotes: 1

Related Questions