- PR -

パネルコントロール

1
投稿者投稿内容
3m
常連さん
会議室デビュー日: 2004/11/05
投稿数: 34
投稿日時: 2004-11-29 09:32
こんにちは。
お世話になります。
WebMatrixにてASP.NET(VB)開発をしております。

パネルコントロールを使用したページでの入力検証で困っています。
パネルコントロールが３つあり、それぞれに数個のテキストボックスが入っています。
この３つのパネルは３つのボタンにて表示、非表示を切り替え
それぞれのテキストボックスに値を入力し「登録」ボタンにて
入力検証および登録をします。
なのですが、登録ボタンを押下した際に表示されている
パネルのみの入力検証しかできずに困っています。
確かに、非表示のパネルを検証できるわけがないのですが…。
このような場合はどのようにすればよいのでしょうか？
よろしくお願いします。

[ メッセージ編集済み 編集者: maw 編集日時 2004-11-29 10:03 ]
momotchi
常連さん
会議室デビュー日: 2004/01/16
投稿数: 28
お住まい・勤務地: 宮城県
投稿日時: 2004-11-29 10:01
こんにちは。
パネルじゃなくてspan や div タグで
表示、非表示してみては。
（JavaScript）

[ メッセージ編集済み 編集者: momotchi 編集日時 2004-11-29 10:04 ]
Jitta
ぬし
会議室デビュー日: 2002/07/05
投稿数: 6267
お住まい・勤務地: 兵庫県・海手
投稿日時: 2004-11-29 22:01
　出力されている（IE上に表示されている）HTMLを確認しましたか？おそらく、VisibleプロパティをTrue/Falseで切り替えて、表示／非表示を切り替えていると思います。この方法だと、「非表示」はHTMLとして出力されていません。このため、オブジェクトがないので検証することができません。さらに、Panelコントロールは、div要素として出力されていることもわかると思います。

　そこで、他に「非表示」にする方法がないか、考えましょう。どこかのウェブページで、「クリックすると内容が表示される」ようなものを見たことがありませんか？例えば、Office製品のヘルプでは、用語をクリックするとその説明が出てきます。Office製品のヘルプは「コンパイルされたHTML」ですから、この方法が使えそうです。

　ということで、HTMLや、CSS（カスケードスタイルシート）を調べてみると、CSSにvisibilityというプロパティがあり、これの値をhidden/visibleで切り替えると、HTMLに出力しながら、表示はしないということができそうです。

　ところが、Panelコントロールのプロパティを見ても、これを制御できるプロパティがありません。先のように、Visibleプロパティは、CSSのvisibilityとは違います。と、よく見ると「Style（スタイル）」というプロパティがあります。「カスケードスタイルシート」のスタイルと、関係があるのでしょうか？ということで、このプロパティをクリックしてみると・・・

_________________
3m
常連さん
会議室デビュー日: 2004/11/05
投稿数: 34
投稿日時: 2004-11-30 12:15
momotchiさん、Jittaさんありがとうございます。
返事が遅くなりすみません。

＞おそらく、VisibleプロパティをTrue/Falseで切り替えて、表示／非表示を切り替えていると思います。
はい、その方法で切り替えていました。
あと、javascript、style.visibilityにて切り替えてもみました。

＞CSSにvisibilityというプロパティがあり、これの値をhidden/visibleで切り替えると、HTMLに出力しながら、表示はしないということができそうです。
なるほど。

＞と、よく見ると「Style（スタイル）」というプロパティがあります。
プロパティ拝見しました。
このような使い方もあるのですね…。
勉強になりました。

さっそくこの方法で試してみたのですが
ボタン押下によりパネル1からパネル2に表示を切り替えた時、html上では
<div id="pnl1" style="width:100%;visibility:hidden;">
<div id="pnl2" style="width:100%;visibility:show;">
<div id="pnl3" style="width:100%;visibility:hidden;">
となっているにも関わらずパネル2は表示されません。（真っ白な状態）
何が悪いのでしょうか…？

あと…３つのパネルコントロールのプロパティvisibleをtrueにしているため表示された時にスクロールバーが長くなってしまいます。
これは改善されないでしょうか？

よろしくお願いします。
3m
常連さん
会議室デビュー日: 2004/11/05
投稿数: 34
投稿日時: 2004-11-30 13:14
＞ボタン押下によりパネル1からパネル2に表示を切り替えた時、html上では
＞<div id="pnl1" style="width:100%;visibility:hidden;">
＞<div id="pnl2" style="width:100%;visibility:show;">
＞<div id="pnl3" style="width:100%;visibility:hidden;">
＞となっているにも関わらずパネル2は表示されません。（真っ白な状態）
申し訳ございません。
先ほど確認していたところパネル１が長いため（テキストボックスが多量のため）パネル２およびパネル３は下の方に表示されていました。

＞３つのパネルコントロールのプロパティvisibleをtrueにしているため表示された時にスクロールバーが長くなってしまいます。
＞これは改善されないでしょうか？
上記のことからパネル１があった場所にパネル２、パネル３を表示したいということになります。
このようなことは無理なのでしょうか？

よろしくお願いします。
todo
ぬし
会議室デビュー日: 2003/07/23
投稿数: 682
投稿日時: 2004-11-30 13:33
Style="display: none;" とか
3m
常連さん
会議室デビュー日: 2004/11/05
投稿数: 34
投稿日時: 2004-11-30 15:02
todoさんありがとうございます。
＞Style="display: none;" とか
pnl1.style("display") = "none"
にて思い通りに表示されました！！

今後ともよろしくお願いします！
1

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