2

to perform a fulltext search users want to simply enter their query into a simple inputText. Then as soon as they hit ENTER the search itself should kick in.

Currently we tried to solve it like this:

  • the inputText is bound to a sessionScope variable myQuery
  • the input also has an OpenPage action bound to its onchange event
  • the page that is to be opened contains a viewPanel with a search filter bound to our sessionScope variable, as well as some more FT filtering fields.

This works fine in Firefox and Chrome but not in IE; obviously IE isn't recognizing the ENTER key as an onchange-trigger.

So I tried to record and analyze the keystrokes using the control's onkeyup event using something like

var q=sessionScope.get("myQuery");
return q.charCodeAt(q.length-1);

Works fine for all standard characters, but not for the ENTER key (where I would have expected to receive code 13).

I currently do have some kind of workaround using CSJS code in the control's onkeyup event as in:

if(event.keyCode===13){
    var p=location.pathname.split("/");
    p.pop();
    location.replace(p.join("/") + "/search.xsp");
}

But this has some side effects which has some potential to make things more complicated, and it feels a bit like some hack. So I'd prefer to solve it using server side scripting.

Question is:

  • is there a way to capture an ENTER key stroke so that we can react to it?
  • or are we maybe on a completely wrong track here?
1

1 Answer 1

5

In IE the onchange event is not fired until the input loses focus: http://komlenic.com/231/internet-explorer-onchange-on-enter/

So you could use some CSJS to catch the ENTER press in IE, and drop focus from the input using .blur() method, which will in turn trigger the onchange event

A quick example I tried out that seems to work:

<xp:inputText id="inputText2" value="#{document1.text1}">
    <xp:eventHandler event="onkeyup" submit="false">
        <xp:this.script><![CDATA[
            var kc = thisEvent.keyCode?thisEvent.keyCode:"";
            if(kc != "" && kc == "13") {
                var input = dojo.byId("#{id:inputText2}");
                input.blur();
            }]]>
        </xp:this.script>
    </xp:eventHandler>
    <xp:eventHandler event="onchange" submit="true" refreshMode="complete">
        <xp:this.action>
            <xp:openPage name="/formInput.xsp"></xp:openPage>
        </xp:this.action>
    </xp:eventHandler>
</xp:inputText>
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.