Wicket ModalWindow: fai clic fuori dal modal per chiudere

Question

Devo aggiungere un comportamento a ModalWindow in modo tale che quando un utente fa clic al di fuori del modal, se viene soddisfatta una certa condizione (controllato lato server nel mio metodo respond()), il modal viene ignorato.

Ho provato a implementare qualcosa basato su questa risposta .Il problema è che non posso allegare un listener di clic al div della finestra modale perché non viene aggiunto al DOM fino a quando non viene mostrato il modal (l'esempio allega un keyup al documento stesso.)

Ho pensato di estendere ModalWindow e aggiungere il JS tramite getShowJavascript(), ma poi non ho alcun mezzo per collegarlo a un metodo AbstractDefaultAjaxBehavior.respond() per il test.

Answer 1

Ho risolto questo problema aggiungendo il comportamento non al modal, ma piuttosto al widget che aggiungo al modal tramite ModalWindow.setContent().Quando il mio widget viene aggiunto al modal, la maschera div è presente nel DOM e posso quindi allegare correttamente un gestore di clic.

Vale a dire:

public static class CloseModalOnOutsideClickBehavior extends AbstractDefaultAjaxBehavior
{
    private final ModalWindow modal;

    public CloseModalOnOutsideClickBehavior(ModalWindow modal)
    {
        this.modal = modal;
    }

    @Override
    protected void respond(AjaxRequestTarget target)
    {
        if (myConditionIsMet()) modal.close(target);
    }

    @Override
    public void renderHead(IHeaderResponse response)
    {
        response.renderJavascriptReference("http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js");
        response.renderJavascript("" +
                "$(document).ready(function() {\n" +
                "  $('div.wicket-mask-dark').bind('click', function(evt) {\n" +
                        getCallbackScript() + "\n" +
                "        evt.preventDefault();\n" +
                "  });\n" +
                "});", "closeModal");
    }
}

Nota che dipendo in qualche modo in modo precario che la maschera della finestra modale abbia una classe chiamata "wicket-mask-dark";questo potrebbe non essere il caso se modifichi le impostazioni CSS utilizzate da ModalWindow.