Вопрос по jsf, jsf-2, selectoneradio, datatable – Как использовать h: selectOneRadio в h: dataTable для выбора одной строки?

5

У меня есть список страниц, отображаемых в таблице. У каждой страницы есть свойство homePage и я хочу, чтобы в datatable имелся столбец переключателей для привязки к этому свойству, и пользователь может проверить только одно значение. Как я могу получить это значение на стороне сервера?

Я видел несколько примеров, таких как следующие: http://jforum.icesoft.org/JForum/posts/list/14157.page, but I would like to know what is the best practice in such case.

Ваш Ответ

3   ответа
0

и я хочу поделиться им с вами, это использоватьh:selectBooleanCheckboxВместе с функцией одиночного выбора JS BalusC предложил:

            <ace:column id="homePage" headerText="Home Page">
                <h:selectBooleanCheckbox value="#{adpage.homePage}" onclick="dataTableSelectOneRadio(this);"></h:selectBooleanCheckbox>
            </ace:column>

и JS:

function dataTableSelectOneRadio(radio) {
var radioId = radio.name.substring(radio.name.lastIndexOf(':'));

for (var i = 0; i < radio.form.elements.length; i++) {
    var element = radio.form.elements[i];

    if (element.name.substring(element.name.lastIndexOf(':')) == radioId) {
        element.checked = false;
               }
         }

      radio.checked = true;
    }

при этом будет установлен только один флажок и обновлено логическое свойство в отмеченном / непроверенном объекте.

Error: User Rate Limit ExceededvalueError: User Rate Limit Exceeded<f:selectItem>Error: User Rate Limit Exceeded<h:selectBooleanCheckbox>Error: User Rate Limit Exceededstackoverflow.com/questions/2524514/…
19

JSF спецвыпуск 329 Я наконец-то реализовал это для JSF 2.3. С новымgroup Атрибут теперь вы сможете группировать переключатели в компонент повторителя.

<h:dataTable value="#{bean.items}" var="item">
    <h:column>
        <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
            <f:selectItem itemValue="#{item}" />
        </h:selectOneRadio>
    </h:column>
</h:dataTable>

Это будет доступно согласно Мохарре 2.3.0-m07.

До JSF 2.3 это не тривиально со стандартным JSF<h:selectOneRadio>, По сути, переключатели в каждой строке должны быть сгруппированы друг с другом, используя один и тот же входname так что другие переключатели отключаются при каждом выборе. Но они не сгруппированы, у них есть все своиnameпоэтому другие переключатели никогда не будут отключены.

Библиотеки компонентов, такие как PrimeFaces, решили эту проблему, предоставив специальный атрибут или компонент столбца. Смотрите такжеэтот пример витрина который использует<p:column selectionMode="single"> создать один столбец выбора. На выбранное значение ссылаетсяselection атрибут<p:dataTable>, Если вы уже используете библиотеку компонентов, и в ней уже есть такой компонент, вам следует использовать ее.

В стандартном JSF<h:dataTable> с<h:selectOneRadio> Вам необходимо ввести обходной путь JavaScript следующим образом, который снимает флажки со всех других переключателей в том же столбце:

<h:dataTable value="#{bean.items}" var="item">
    <h:column>
        <h:selectOneRadio valueChangeListener="#{bean.setSelectedItem}"
            onclick="dataTableSelectOneRadio(this);">
            <f:selectItem itemValue="null" />
        </h:selectOneRadio>
    </h:column>
    ...
</h:dataTable>

с

public void setSelectedItem(ValueChangeEvent event) {
    FacesContext context = FacesContext.getCurrentInstance();
    selectedItem = context.getApplication().evaluateExpressionGet(context, "#{item}", Item.class);
}

а также

function dataTableSelectOneRadio(radio) {
    var radioId = radio.name.substring(radio.name.lastIndexOf(':'));

    for (var i = 0; i < radio.form.elements.length; i++) {
        var element = radio.form.elements[i];

        if (element.name.substring(element.name.lastIndexOf(':')) == radioId) {
            element.checked = false;
        }
    }

    radio.checked = true;
}
Error: User Rate Limit Exceeded Mahmoud Saleh
Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded<f:ajax execute="@this" render="@form" />Error: User Rate Limit Exceededh:selectOneRadioError: User Rate Limit ExceededvalueChangeListenerError: User Rate Limit Exceeded Mahmoud Saleh
Error: User Rate Limit Exceededstackoverflow.com/questions/10970248/… Mahmoud Saleh
Error: User Rate Limit Exceeded<f:ajax>Error: User Rate Limit Exceeded
0

зованием ниже JavaScript

function uncheckRadioButtons(radioButton) {
var selectedRadioButton;
   if (selectedRadioButton != null) {
      selectedRadioButton.checked = false;
   }

   selectedRadioButton = radioButton;
   selectedRadioButton.checked = true;
}

и в xhtml

 <h:selectOneRadio 
        onclick="uncheckRadioButtons(this);">
        <f:selectItem itemValue="null" />
    </h:selectOneRadio>

Похожие вопросы