Question

我需要向ModalWindow添加一个行为，以便当用户点击模态外部时，如果满足某个条件（在我的respond()方法中检查服务器端），则模式为驳回。

我尝试基于this answer实现某些功能。问题是我无法将一个点击监听器附加到模态窗口div，因为在显示模态之前它没有添加到DOM（该示例将keyup附加到文档本身。）

我想扩展ModalWindow并通过getShowJavascript()添加JS，但是我没有办法将它连接到AbstractDefaultAjaxBehavior.respond()方法进行测试。

Answer 1

我通过将行为添加到模态而不是通过ModalWindow.setContent()添加到模态的小部件来解决这个问题。当我的小部件添加到模态时，掩码div存在于DOM中，然后我可以成功附加单击处理程序。

即便：

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");
    }
}

请注意，我有点不稳定，取决于模态窗口的掩码有一个名为“wicket-mask-dark”的类;如果您更改ModalWindow使用的CSS设置，则可能不是这种情况。

Wicket ModalWindow：点击外部模态以解散

1 个答案: