In 91

前言
這一篇要介紹的是DropDownList, ListBox, RadioButtonList, CheckBoxList，其餘比較複雜的資料繫結控制項，如Repeater, DataList, DataGrid, GridView, ListView等等，因為要注意的事項太多了，就請有興趣的人請自行至MSDN文件庫查閱，上面有完整的文件說明以及sample code。可以從目的當作切入點，去參考一些How To的文章。

DropDownList的介紹

1. MSDN reference：http://msdn.microsoft.com/zh-tw/library/system.web.ui.webcontrols.dropdownlist(VS.80).aspx
   
   
2. 屬性
   1. Items：清單控制項中項目的集合
   2. DataTextField：要Binding到Item.Text的欄位名稱
   3. DataValueField：要Binding到Item.Value的欄位名稱
   4. SelectedIndex：選取項目的索引，沒選為-1
   5. SelectedValue：選取項目的值
   6. SelectedItem：具有最低索引的選取項目
   7. AppendDataBoundItems：是否在資料繫結之前清除清單項目，通常拿來做第一個『請選擇』的項目，設定為true之後，binding的items為Append
   8. AutoPostBack：設定為true，則在client端onchange時呼叫__doPostBack()
      
      
3. 方法
   1. DataBind()
      • 給完DataSource之後，記得要呼叫DataBind()才會實際繫結。
      • 呼叫DataBind()之後，會將原本選取的狀態清空
   2. Items.Clear()：將DropDownList的項目清空
      
      
4. 事件：SelectedIndexChanged，當SelectedIndex與上次的值有改變的時候觸發
   
   
5. HTML tag
   1. DropDownList：<select>
   2. Items：<option>
      
      
6. 注意
   1. Index的範圍：注意超出索引範圍的exception
   2. DataBind()之前，應設定DataTextField與DataValueField，給定DataSource後，再呼叫DataBind()
   3. 呼叫DataBind()會清空選取的狀態，如果碰到postback後選取狀態掉了，很有可能就是DataBind()的部分沒有判斷 !IsPostBack
   4. 連動式DropDownList的作法
      • 拉式選單的連動：http://social.msdn.microsoft.com/Forums/zh-TW/236/thread/9f0342e6-c717-4534-9bf8-02808332139b
      • CascadingDropDown with PageMethods：http://bibby.be/2008/04/cascadingdropdown-with-pagemethods.html
      • ASP.NET MVC 連動式下拉式選單：http://demo.tc/Post/547

ListBox的介紹

1. MSDN reference：http://msdn.microsoft.com/zh-tw/library/system.web.ui.webcontrols.listbox(VS.80).aspx
   
   
2. 屬性
   1. Rows：呈現列數
   2. SelectionMode：多選或單選
      
      
3. 資料繫結方式同DropDownList
   
   
4. HTML tag
   1. ListBox：預設為<select size="4" />
   2. Rows：size屬性
   3. SelectionMode：multiple="multiple"
      
      
5. 注意
   1. 常用變形例子：黑暗執行緒：CODE-用jQuery實作<select>選項上下移動(複選版)：

RadioButtonList的介紹

1. MSDN reference：http://msdn.microsoft.com/zh-tw/library/system.web.ui.webcontrols.radiobuttonlist(VS.80).aspx
   
   
2. 屬性
   1. RepeatColumns：顯示的行數，會根據RepeatDirection調整為欄或列
   2. RepeatDirection：群組中選項按鈕的顯示方向，水平或垂直
   3. RepeatLayout：群組內選項按鈕的配置
      • Table：顯示在table中
      • Flow：不顯示table結構，通常用在最後一個radio後面還需要緊接著其他control，例如TextBox
        
        
3. 資料繫結方式同DropDownList
   
   
4. 用在單選，且需可以看到全部選項的清單
   
   
5. HTML tag
   1. Table：<table id="server control.ID"><tr><td><input type="radio" name="server control.ID"><label>XXX</label></input></td></tr></table>
   2. Flow：<span>取代<table<tr><td>

CheckBoxList的介紹

1. MSDN reference：http://msdn.microsoft.com/zh-tw/library/system.web.ui.webcontrols.checkboxlist(VS.80).aspx
   
   
2. 行為屬性同RadioButtonList
   
   
3. 注意
   1. SelectedValue只選的到有勾選，且index最小的值
   2. 如何確認有哪一些項目被勾選？可透過foreach checkboxlist.items + if(item.checked)，也可參考：CheckBoxList複選的SelectedValue，用逗號串接

 

---

最後，請想學習的客倌，看完這篇文章思考一下，下列的問題該如何回答：

1. DropDownList該如何bind資料？
2. DropDownList該怎麼樣加入『請選擇』的項目，而不受datasource影響？
3. DropDownList對應的HTML為何？ListBox對應的HTML為何？Items對應的HTML為何？
4. CheckBoxList該如何得到勾選的值？
5. RadioButtonList與CheckBoxList該怎麼改變呈現的方向？
6. ListBox呈現的列數如何控制？對應的HTML屬性為何？ 多選與單選該怎麼控制？對應的HTML屬性為何？

---

blog 與課程更新內容，請前往新站位置：http://tdd.best/