札幌Web制作のシンクグラフィカ

スイッチング機能で複数の項目を制御したい

やまさん (2013-04-10 12:43:30) http://www.walkerz.info/test_form/sw.html

お世話になっています。スイッチング機能・・・まさにほしかった機能です。助かってます。
さて、IDが1対1で対応するものは問題ないのですが、1対多(例えばボタン1、2、3・・・に対し表示するエリアが累積 して増えていく)の場合のswitching.jsの書き方がよくわかりません(泣)。
自分なりにあれこれと色々いじって試してみたのですが、基礎ができていないもので、正しい書き方になっていないのでしょうね。エラーが出てうまく動きません。
複数のものを切り替える場合の書き方を、どうかご教示願いたいと思います。(または、「これこれをググって、このサイトをよく読め」・・・といったアドバイスでも結構ですので)
*とりあえすつくったテストフォーム→http://www.walkerz.info/test_form/sw.html
*ホントはこんな風に動いてほしい→http://www.walkerz.info/test_form/sw2.html(別のjavascriptを使って、やりたいことを表現したものです。残念ながらこのやり方では必須項目の有効・無効の切り替えができません 。)
よろしくお願いします。

Re:スイッチング機能で複数の項目を制御したい

和田 (2013-04-15 19:01:43) www.synck.com

http://www.walkerz.info/test_form/sw2.html
こちらの方向で進めたほうが恐らく簡単ですね。
現在、単純にstyleをblock、noneでスイッチしてると思いますが、そこに
document.getElementById("btn1").disabled = true;
でエレメント自体が無効になります。
document.getElementById("btn1").disabled = false;
だと有効です。

Re:Re:スイッチング機能で複数の項目を制御したい

やまさん (2013-04-17 15:53:21) http://www.walkerz.info/test_form/sw3.html

ご回答ありがとうございます。おっしゃられた方向で進めていってます。
ただ、単に<form>~</form>の中に記述したら動くのに
<form id="mailformpro" action="mailformpro/mailformpro.cgi" method="POST">~</form>
の中だと動かなくなるなど、いろいろ(おそらく初歩的な)知識不足から来る問題に悩まされていますが、何とか勉強やって行こうと思います。
アドバイスありがとうございました。