Смена фокуса на следующее поле ввода при достижении максимальной длины - PullRequest
0 голосов
/ 28 марта 2012

Я хочу изменить фокус fechaI, после того как он достигнет максимальной длины (которая равна 2) и установить фокус на mesI Заранее спасибо и извините за мой английский, а не мой основной.

<h:form id:form>
...
<h:inputText id="fechaI" value="#{solicitud.fechaI}" maxlength="2" size="2">
<a4j:ajax event="change" render="fechaI"/> 
</h:inputText>

<h:inputText id="mesI" value="#{solicitud.mesI}" maxlength="2" size="2" >
<a4j:ajax event="change" render="mesI"/> 
</h:inputText>

<h:inputText id="anoI" value="#{solicitud.anoI}" maxlength="4" size="4" >
<a4j:ajax event="change" render="anoI"/> 
</h:inputText>
...
</h:form>

ОБНОВЛЕНИЕ моего кода, все еще не работает:

<h:form id="form">
    <h:inputText id="fechaI" value="#{solicitud.fechaI}" maxlength="2" size="2" tabindex="1"/>
    <h:inputText id="mesI" value="#{solicitud.mesI}" maxlength="2" size="2" tabindex="2" />
    <h:inputText id="anoI" value="#{solicitud.anoI}" maxlength="4" size="4"  tabindex="3" />
</h:form>
<script type="text/javascript">
    //<![CDATA[
  $('input[maxlength][tabindex]').on('keyup', function() {
    $this = $(this);
    if ($this.val().length == $this.attr('maxlength')) {
        $('input[maxlength][tabindex=' + ($this.attr('tabindex') + 1) + ']').focus();
    }
  });
//]]>
</script>

Ответы [ 2 ]

5 голосов
/ 29 марта 2012

Вы можете использовать выражение JavaScript и RichFaces # {rich: element} , как показано ниже.

    <h:form>
        <h:inputText id="fechaI" value="" maxlength="2" size="2" onkeyup="if(this.value.length >= this.getAttribute('maxlength')) {#{rich:element('mesI')}.focus()}"/>
        <h:inputText id="mesI" value="" maxlength="2" size="2" onkeyup="if(this.value.length >= this.getAttribute('maxlength')) {#{rich:element('anoI')}.focus()}"/>
        <h:inputText id="anoI" value="" maxlength="4" size="4"/>
    </h:form>
1 голос
/ 28 марта 2012

Для этого нет средств или компонентов JSF. Вам понадобится немного JavaScript.

Сначала дайте входам также tabindex

<h:inputText ... maxlength="2" tabindex="1" />
<h:inputText ... maxlength="2" tabindex="2" />
<h:inputText ... maxlength="4" tabindex="3" />

Тогда вы можете заставить его работать, выполнив этот небольшой снимок jQuery на DOM ready

$('input[maxlength][tabindex]').on('keyup', function() {
    var $this = $(this);
    if ($this.val().length == $this.attr('maxlength')) {
        $("input[maxlength][tabindex='" + (parseInt($this.attr('tabindex')) + 1) + "']").focus();
    }
});

Если вы используете более старую версию RichFaces, которая не включает jQuery 1.7.x, тогда используйте jQuery.live() вместо jQuery.on().

...