I'm using this jQuery function to jumping on "input" styled components of the form:
$('*').live("keydown", function(e)
{
var inputs = $(this).parents("form").eq(0).find(".input:visible:enabled");
var idx = inputs.index(this);
// ENTER IS PRESSED
if (e.keyCode == 13)
{
if (idx == inputs.length - 1)
{
inputs[idx + 1].select();
}
else
{
inputs[idx + 1].focus();
inputs[idx + 1].select();
}
return false;
}
// TAB IS PRESSED
if (e.keyCode == 9)
{
inputs[idx + 1].select();
return false;
}
});
and this components on the form (reduced code):
<h:inputText id="persId" tabindex="1" styleClass="input">
<h:selectOneMenu id="type" tabindex="1" styleClass="input">
<h:selectOneMenu id="no" tabindex="1" styleClass="input">
<h:commandButton type="submit" tabindex="2" id="btnSubmit" styleClass="btninput"/>
what I need is to jumping on 3 inputs and after that submit a form (using Enter). When I replace selectOneMenu by inputText, it works fine, but with selectOneMenu, it doesn´t.
TAB rotate all three components normally.
What am I doing wrong?
UPDATE: perhaps it would be enough to fire enter normally if (idx == inputs.length - 1)
, but I don´t know how..?
SOLVED: aha, it's simple, just add document.getElementById('food:btnSubm开发者_JAVA技巧it').click();
:)
I hope this isn't a page for the internet. It's not smart to interfere with browser default behaviour.
Have you tried just returning true instead of false if they were on the last input?
Solved: just fire submit button if appropriate conditions are performed
.....
if (e.keyCode == 13)
{
if (idx == inputs.length - 1)
{
document.getElementById('formId:buttonId').click();
}
}
.....
精彩评论