Tuesday, April 23, 2013

Close a ModalWindow on keypress : Wicket

Close the model window on click of "Esc" and "enter" key :

keycode for "Esc"  even is 27 and "enter" even  is 13. Please refer
http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes for other events

 Create a class which will extend AbstractDefaultAjaxBehavior:


private static class OnKeyPressBehavior extends AbstractDefaultAjaxBehavior {

            /**

             *

             */

            private static final long serialVersionUID = 1L;

            private ModalWindow modalWindow;

        public OnKeyPressBehavior(ModalWindow modalWindow) {

            this.modalWindow = modalWindow;

        }   

        @Override

        protected void respond(AjaxRequestTarget target) {

            modalWindow.close(target);

        }   

       

        @Override

            public void renderHead(IHeaderResponse response) {

            response.renderJavascriptReference("https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js");

            response.renderJavascript("" +

                "$(document).ready(function() {\n" +

                "  $(document).bind('keyup', function(evt) {\n" +

                "    if (evt.keyCode == 27 || evt.keyCode == 13) {\n" +

                getCallbackScript() + "\n" +

                "        evt.preventDefault();\n" +

                "    }\n" +

                "  });\n" +

                "});", "closeModal");

        }

           

    }

Add this behavior on your webpage and pass your  modelwindow :

add(new OnKeyPressBehavior(modalWindow)); 

No comments:

Post a Comment