在網頁表單中設計選擇題,通常是用RadioButton或是CheckBox這二個控制項,
早期在用VB Script開發ASP網頁時,單選用RadioButton而複選就用CheckBox,
但到了.Net的環境似乎沒差了,最終也是業主希望你按照他的方式設計!

最近就碰到一個案例,希望從資料庫撈出來後用單選的CheckBox型態供選擇,
趴了許多文也試了許多方法,最後自己測出這個簡單的技巧在此留下筆記...

第1步:提供CheckBox的表單
第2步:當使用者勾選後,立即暫存所有項目的"狀態"
第3步:當使用者再勾選時,比對前後二次的"狀態"便可過濾掉之前的選擇

以之前提供過的方式從資料庫載入,並製作成CheckBox的表單:
http://jerry5217.pixnet.net/blog/post/257390008

當按下"條列姓名選單"後,利用DataList將資料輸出在頁面:

如上圖,將CheckBox的屬性設定AutoPostBack="True",
以及利用OnCheckedChanged事件來處理上述的第2步及第3步,
然後利用一個Label控制項Hidden_PSCbx_Temp來暫存選擇的狀態,

當OnCheckedChanged事件發生時,Cbx_PSSel的程式碼如下:

由Hidden_PSCbx_Temp控制項來暫存當下的狀態,
例如:第一次選擇馬小九的時候Hidden_PSCbx_Temp="010000"

第二次選擇陳小扁的時候Hidden_PSCbx_Temp="001000"

當選擇"陳小扁"的時候,原本勾選"馬小九"的狀態就會消失!

其實在Cbx_PSSel的程式碼中,利用for迴圈取得當下每個CheckBox的狀態時,
就在逐一比對Hidden_PSCbx_Temp的內容,所以當第二次選擇陳小扁的時候,
for迴圈是用"011000"的狀態在比對前一次暫存的"010000",
發現第二字元重複!故將當下的CheckBox狀態取消勾選,
馬小九這個選項就順勢被取消勾選了...

所以最後我們將Label控制項Hidden_PSCbx_Temp設定Visible="False",
在頁面就看不到這堆0跟1,目的就達成了!

 

 

arrow
arrow

    王振權 發表在 痞客邦 留言(0) 人氣()