- PR -

JSF　チェックボックスのオンオフとデータテーブル内の入力制御方法

1
投稿者投稿内容
あさ
会議室デビュー日: 2006/03/14
投稿数: 8
投稿日時: 2006-03-14 14:00
はじめましてJava初心者です。

チェックボックス(selectBooleanCheckbox)とテキストボックス、
JSFのデータテーブル(テキストボックスを含む)を使用した画面を作成しています。

下記のような制御を実現させようとしているのですが、
チェックボックスのオンオフのアクションがとれないため、データテーブル内の
テキストボックスの制御が出来ません。

通常のテキストボックスは、チェックボックスに「onclick」を使用して実現できてます。

---------------------------------------------------
・チェックボックスがオンの場合、
　テキストボックスの入力可能、
　データテーブル内のテキストボックス入力不可能

・チェックボックスがオフの場合
　テキストボックスの入力不可能、
　データテーブル内のテキストボックス入力可能
---------------------------------------------------

データテーブル内のテキストボックスもチェックボックスのオン、オフにて入力可能、不可能に変更できる方法を何方かご存知の方がいらっしゃいましたら、ご教授ねがいます。
よろしくお願いします。

ちなみに、「valueChangeListener」を実装してみたのですが、
指定されたメソッドを呼び出してくれませんでした。

【環境】
eclipce 3.0.1
MyFaces
JDK 1.4.2_08
よしだひろゆき
大ベテラン
会議室デビュー日: 2004/11/22
投稿数: 141
投稿日時: 2006-03-14 18:52
仕様がよく分かりませんね．

> 通常のテキストボックスは、チェックボックスに「onclick」を使用して実現できてます。
このサンプルを示してみていただけませんか？
それと比べて何をしたいのかを説明して下さい．
あさ
会議室デビュー日: 2006/03/14
投稿数: 8
投稿日時: 2006-03-15 10:12
返答ありがとう御座います。
わかりにくい説明で申し訳御座いませんでした。

下記にサンプルを記述します。

<script type='text/javascript'>
<!--
function gochumomBangoTextCtl() {
var checkBoxFlg = document.forms['form'].elements['form:gochumomBangoFlg'].checked;
if (checkBoxFlg == true) {
document.forms['form'].elements['form:gochumomBango'].readonly = false;
document.forms['form'].elements['form:gochumomBango'].disabled = false;
document.forms['form'].elements['form:gochumomBango'].style.backgroundColor = 'white';
}
if (checkBoxFlg == false) {
document.forms['form'].elements['form:gochumomBango'].readonly = true;
document.forms['form'].elements['form:gochumomBango'].disabled = true;
document.forms['form'].elements['form:gochumomBango'].style.backgroundColor = 'silver';
}
}
//-->
</script>
<table width="800" class="body-text">
<tr>
<td align="left">
<h:selectBooleanCheckbox id="gochumomBangoFlg" value="#{bean.gochumomBangoFlg}" onclick="gochumomBangoTextCtl()"/>
<h:outputLabel value="ご注文番号" for="gochumomBangoFlg"/>
<h:inputText id="gochumomBango" value="#{bean.gochumomBango}" size="20" maxlength="20" styleClass="text-en" />
</td>
<td valign="bottom" align="right" width="390">
<h:commandButton id="searchJokenClear" action="#{bean.searchJokenClear}" value="クリア"/>
</td>
<td align="right">
<h:commandLink action="#{bean.next}">
<h:graphicImage url="images/buhinnext.gif" styleClass="img-goNext" />
</h:commandLink>
</td>
</tr>
</table>
<h:dataTable id="buhinTable" binding="#{bean.cartTable}" value="#{bean.cartList}" var="cartList">
<h:column>
<f:facet name="header">
<h:outputText value="No." />
</f:facet>
<h:outputText value="#{cartList.No}" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="個別ご注文番号" />
</f:facet>
<h:inputText id="kobetsuGochumomBango" value="#{cartList.kobetsuGochumomBango}" size="19" maxlength="20" />
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="" /><br>
</f:facet>
<h:commandLink action="#{bean.deleteBuhin}">
<h:graphicImage url="/common/images/delete.gif" />
</h:commandLink>
</h:column>
</h:dataTable>

ご注文番号のチェックボックスがオンの場合、ご注文番号のinputTextは入力可能とし、
オフの場合は、入力不可の制御をonclickのイベントでjavascriptをもちいて実現しています。
このご注文番号のチェックボックスのオンオフでデータテーブル内の個別ご注文番号の入力制御を行いたいのですが、チェックボックスのオンオフのアクションがとれず実現できていない状況です。

この制御方法がございましたら、ご教授お願い致します。
長文になり申し訳御座いませんが、宜しくお願い致します。
よしだひろゆき
大ベテラン
会議室デビュー日: 2004/11/22
投稿数: 141
投稿日時: 2006-03-16 11:58
やりたいことは分かりましたが，「チェックボックスのオンオフのアクションがとれず」
というのはどういうことでしょうか？

あまりJSFの問題のように感じられません．JavaScriptの書き方のご質問でしょうか？
対象のinputTextのidが分からないのであれば，表示させたhtmlソースを見れば規則が
分かると思いますが？
あさ
会議室デビュー日: 2006/03/14
投稿数: 8
投稿日時: 2006-03-17 17:42
お世話になっております。

ありがとう御座いました。解決いたしました。

【質問時の記述】
<h:selectBooleanCheckbox id="gochumomBangoFlg" value="#{bean.gochumomBangoFlg}"
onclick="gochumomBangoTextCtl()"/>

【修正後の記述】
<h:selectBooleanCheckbox id="gochumomBangoFlg"
value="#{bean.gochumomBangoFlg}" onclick="submit()" immediate="true"
valueChangeListener="#{bean.onValueChanged}"/>

質問時の記述の場合、「valueChangeListener」を追記し実装しても、
指定されたメソッドを呼び出してくれませんでした。

修正後の記述で｢onclick="submit()"｣を行うことによって、「valueChangeListener｣が
指定したメソッドを呼ぶことができました。

お騒がせ致しました。
1

スキルアップ／キャリアアップ（JOB@IT）