Sylvus
Sylvus

Reputation: 165

Wicket key event -> get key!

one more question: I created an inputfield and added an AjaxFormComponentUpdatingBehavior ("onkeyup"). Now I want to execute some code only if the right key (space-key) is pressed. How am I able to get the last pressed key? I thought it would be stored in the target attribute but I couldn't find it there... Is there any easy way to solve this problem?

Thx guys! CU Sylvus

Upvotes: 2

Views: 3864

Answers (2)

Sylvus
Sylvus

Reputation: 165

I found the solution, thanks to Google and Firebug.

searchInput.add(new AbstractBehavior() {
    private static final long   serialVersionUID    = 1L;
    private Component           component;

    @Override
    public void bind(final Component component) {
        this.component = component.setOutputMarkupId(true);
    }

    @Override
    public void renderHead(final IHeaderResponse response) {
        response.renderJavascriptReference(WicketEventReference.INSTANCE);

        response.renderOnDomReadyJavascript("document.getElementById('" +
          this.component.getMarkupId() + "').onkeyup=function(event){\n" +
          "if(32==event.keyCode){\n" + "alert('you pressed space!!!')" + "\n}" +
          "}");
    }
});

Upvotes: 0

Sean Patrick Floyd
Sean Patrick Floyd

Reputation: 299178

You should not use an AjaxFormComponentUpdatingBehavior if you want to capture keys. This behavior is reserved for actions that update the form component model. I would probably try to do it in javascript alone, especially if you are using a javascript framework like mootools or prototype. Here is some sample code for mootools (no need to send this to the server):

    this.add(new TextField<String>("textField").add(new AbstractBehavior(){

        private static final long serialVersionUID = 1L;
        private Component component;

        @Override
        public void bind(final Component component){
            this.component = component.setOutputMarkupId(true);
        }

        @Override
        public void renderHead(final IHeaderResponse response){
            response.renderOnDomReadyJavascript(
                "$('" + this.component.getMarkupId() + "')" +
                    ".addEvent('keyup',function(event){" +
                        "if(' '==event.key){" +
                            "alert('you pressed space!!!')" +
                        "}" +
                    "}" +
                ");");
        };

    }));

if no js library is available, here's a wicket-only solution:

        @Override
        public void renderHead(final IHeaderResponse response){
            response.renderJavascriptReference(WicketEventReference.INSTANCE);
            response.renderOnDomReadyJavascript("Wicket.Event.add('"
                + this.component.getMarkupId()
                + "',onkeyup',function(event){" + "if(' '==event.key){"
                + "alert('you pressed space!!!')" + "}" + "}" + ");");
        };

but this does not deal with cross-browser issues in event handling

Upvotes: 1

Related Questions