表にページのリストが表示されています。各ページにはプロパティhomePageがあり、データテーブルにこのプロパティにバインドされるラジオボタンの列を持たせたいのですが、ユーザーは1つの値しかチェックできません。サーバー側でこの値を取得するにはどうすればよいですか?
http://jforum.icesoft.org/JForum/posts/list/14157.pageのような例を見ましたが、そのよう な場合のベストプラクティスを知りたいと思います。
表にページのリストが表示されています。各ページにはプロパティhomePageがあり、データテーブルにこのプロパティにバインドされるラジオボタンの列を持たせたいのですが、ユーザーは1つの値しかチェックできません。サーバー側でこの値を取得するにはどうすればよいですか?
http://jforum.icesoft.org/JForum/posts/list/14157.pageのような例を見ましたが、そのよう な場合のベストプラクティスを知りたいと思います。
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>
Mojarra 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;
}