Как я могу получить значение SelectOneMenu в Bootsfaces с помощью JavaScript или JQuery?

Question

Я новичок в JSF и хочу получить значение SelectOneMenu с помощью javascript или jquery для проверки формы.

Я попытался получить это обычным способом, как это:

function apasa() {
   var a = $("#j_idt68Inner").val();
   alert(a);
}

Но это возвращает ноль. Это код JSF:

<b:column medium-screen="6">
  <b:selectOneMenu  colMd="2" required="true"  labelColMd="2" style="width:200px;margin-top: 30px;" >
    <f:selectItem itemLabel="Selecteaza raport" itemValue="" />
    <f:selectItem itemLabel="1.Neconcordante D394" itemValue="1" />
    <f:selectItem itemLabel="2.Neconcordante D112 REVISAL" itemValue="2" />     
  </b:selectOneMenu>
</b:column>

Этот компонент находится в форме. Я хотел бы получить данные из itemValue.

Answer 1

Общий совет: забудьте об идентификаторах, когда вы работаете с JSF. Скорее используйте псевдо-классы CSS.

Длинный ответ: JSF использует полностью идентифицированные идентификаторы. Это блестящая идея. Это позволяет использовать один и тот же идентификатор для каждой строки в таблице. Внутри JSF добавляет префикс к этим идентификаторам, но на первый взгляд скрывает это от вас. В большинстве случаев это приводит к хорошему и простому API для программистов на Java.

Проблемы возникают, если вы используете jQuery. Помимо прочего, полный идентификатор содержит хотя бы одно двоеточие. Вы должны избежать этого в каждом селекторе jQuery. Кроме того, вам нужно знать полное имя.

Таким образом, вы либо знакомитесь с тем, как составлен идентификатор. Хотя это хороший подход - подход JSF к идентификаторам прост и умен! - Я не рекомендую это. Чаще всего псевдо CSS-класс проще использовать, например, так:

<b:selectOneMenu class="raport-selection" >
  <f:selectItem itemLabel="Selecteaza raport" itemValue="" />
  <f:selectItem itemLabel="1.Neconcordante D394" itemValue="1" />
  <f:selectItem itemLabel="2.Neconcordante D112 REVISAL" itemValue="2" />     
</b:selectOneMenu>

Теперь вы можете получить доступ к значению с помощью простых селекторов jQuery:

$(".raport-selection").val();

Есть два "но":

1. Подход псевдокласса терпит неудачу, если вы используете поле выбора несколько раз в таблице или в <ui:repeat> смотреть. В этом случае вы получите несколько копий одного и того же поля ввода, каждое из которых будет иметь один и тот же псевдокласс CSS.

2. Есть два вкуса <b:selectOneMenu>, Если вы активируете select2=true Опция BootsFaces генерирует совершенно другой HTML-код. Пожалуйста, посмотрите на https://select2.org/ чтобы увидеть, как select2 аромат реализован.