Действие по умолчанию, выполняемое при нажатии ввода в форме

Это не относится к JSF. Это характерно для HTML. В разделе 4.10.22.2 спецификации форм HTML5 в основном указывается, что первый встречающийся <input type="submit"> элемент в "древовидной структуре" в том же <form>, что и текущий элемент ввода в дереве HTML DOM, будет вызываться при нажатии клавиши ввода.

В основном есть два обходных пути:

• Используйте JavaScript, чтобы зафиксировать нажатие клавиши ввода и вызвать нужную кнопку.

  <h:form onkeypress="if (event.keyCode == 13) { document.getElementById('formid:saveid').click(); return false; }">
  

  Если у вас есть текстовые поля в форме, вы хотите разместить JS на всех элементах ввода, не являющихся текстовыми, а не на форме. См. Также Запретить пользователям отправлять форму, нажав Enter < / а>.

  ---

• Поменяйте местами кнопки в HTML и используйте поплавки CSS, чтобы поменять местами их обратно.

  <div style="width: 100px; clear: both;">
      <h:commandButton action="#{bean.save}" value="Save" style="float: right;" />
      <h:commandButton action="#{bean.reset}" value="Reset" style="float: left;" />
  </div>
  

  Это может потребовать лишь некоторой настройки пикселей. Конечно, поместите CSS в отдельный .css файл; использование style - плохая практика, приведенный выше пример приведен для краткости.

  ---

Если вы используете PrimeFaces, начиная с версии 3.2, вы можете использовать <p:defaultCommand>, чтобы декларативно определить кнопку, которая должна быть вызвана при нажатии клавиши ввода в форме.

<h:form>
    <p:defaultCommand target="save" />
    ...
    <h:commandButton id="reset" action="#{bean.reset}" value="Reset" />
    <h:commandButton id="save" action="#{bean.save}" value="Save" />
</h:form>

Это скрыто с использованием JavaScript для того, что присоединяет keydown слушателя к родительскому <h:form>, который, в свою очередь, проверяет, нажата ли клавиша ввода в элементе, не являющемся текстовым полем / кнопкой / ссылкой, а затем вызывает click() в целевом элементе. В основном то же самое, что и первое упомянутое обходное решение в этом ответе.

Я нашел способ, который менее хакерский и хорошо работает. Идея скрытая commandButton.

К сожалению, стиль display:none использовать нельзя, потому что тогда commandButton будет проигнорирован. visibility:hidden не годится, потому что он сохраняет пространство для компонента зарезервированным.

Но мы можем настроить стиль так, чтобы его внешний вид был равен нулю с помощью следующего CSS:

.zeroSize {
    visibility: hidden;
    padding: 0px;
    margin: 0px;
    border: 0px;
    width: 0px;
    height: 0px;
}

И теперь все, что вам нужно, это:

<h:commandButton value="" action="#{bean.save}" class="zeroSize" />

В результате появится невидимая командная кнопка, которая может быть активирована в соответствии с правилом первой следующей кнопки отправки.

Чтобы скрыть элементы, вы можете использовать css: style="visibility: hidden"

Чтобы изменить действие по умолчанию, если вы используете Primefaces, вы можете использовать: <p:defaultCommand target="yourButtonDefault" /> Например:

<h:form id="form">

    <h:panelGrid columns="3" cellpadding="5">
        <h:outputLabel for="name" value="Name:" style="font-weight:bold"/>
        <p:inputText id="name" value="#{defaultCommandBean.text}" />
        <h:outputText value="#{defaultCommandBean.text}" id="display" />
    </h:panelGrid>

    <p:commandButton value="Button1" id="btn1" actionListener="#{defaultCommandBean.btn1Submit}" ajax="false"/>
    <p:commandButton value="Button2" id="btn2" actionListener="#{defaultCommandBean.btn2Submit}" />
    <h:commandButton value="Button3" id="btn3" actionListener="#{defaultCommandBean.btn3Submit}" />

    <p:defaultCommand target="btn3" />

</h:form>

Источник: новый компонент Primefaces: DefaultCommand

Следуя рекомендациям BalusC по решению проблемы с помощью JavaScript, я написал код jQuery для выполнения этой работы:

$(function(){
  $('form').on('keypress', function(event){
    if(event.which === 13 && $(event.target).is(':input')){
        event.preventDefault();
        $('#save').trigger('click');
    }
  });
});

CodePen: http://codepen.io/timbuethe/pen/AoKJj

Игнорируйте клавишу ENTER только в полях ввода текста (source):

<script type="text/javascript"> 

  function stopRKey(evt) { 
     var evt = (evt) ? evt : ((event) ? event : null); 
     var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); 
     if ((evt.keyCode == 13) && (node.type=="text"))  {return false;} 
  } 

  document.onkeypress = stopRKey; 

</script>

Вы можете использовать h:commandLink для первой кнопки и стилизовать ее с помощью css, например h:commandButton.

Например, начальные страницы "btn btn-default" выглядят одинаково для commandLink и commandButton.