當麻許的超技八

因為Silverlight and Flex 寫習慣，很多地方以為會很溫馨..
下.Value的語法就可以取到值..

但是在HTML的世界裡面..我才發現很溫馨的CheckBoxList
網路上看到許多方法，最後我試了一個方法有點偷吃步，但是我覺得目前很夠我用..


先看看一般的狀況
C# Code:
==============================================================================

var a = new ListItem("A", "我");

var b = new ListItem("B", "是");

var c = new ListItem("C", "測");

var d = new ListItem("D", "試");

this.CheckBoxList2.Items.Add(a);

this.CheckBoxList2.Items.Add(c);

this.CheckBoxList2.Items.Add(b);

this.CheckBoxList2.Items.Add(d);

很簡單的範例那我們看看Firebug下面的dom結構..



果然ASP.net 他是用Table + Input + Label 去模擬出來的…即使我有代入ListItem的值為'我','是','測','試'…
在html中其實都不會看到這些字樣..

很好..接下來我要小改寫一些地方…

            var a = new ListItem("A", "我");

            a.Attributes.Add("id", "我");

            var b = new ListItem("B", "是");

            b.Attributes.Add("id", "是");

            var c = new ListItem("C", "測");

            c.Attributes.Add("id", "測");

            var d = new ListItem("D", "試");

            d.Attributes.Add("id", "試");

            this.CheckBoxList2.Items.Add(a);

            this.CheckBoxList2.Items.Add(b);

            this.CheckBoxList2.Items.Add(c);

            this.CheckBoxList2.Items.Add(d);

OK..其中我偷偷在ListItem裡面插入了id這attribute 並且帶入我想放的值…

現在我們來看看Firebug下面的德性..


很好..他多了一個span去塞入的id..天啊..哪邊來的span 不過至少有在client端出現了..至少解決部分問題了.
現在我們來看看Code 怎麼去讀取user 勾起來的東西..

           function GetResult() {

                var checkBox = document.getElementById('<%=this.CheckBoxList1.ClientID %>');

                var inputs = checkBox.getElementsByTagName('input');

                var spam = checkBox.getElementsByTagName('span');

                var ids = ""; 

                for (var i = 0; i < inputs.length; i++) {

                    var inputItem = inputs[i];

                    if (inputItem.type.substr(0, 8) == 'checkbox') {

                        if (inputItem.checked == true)

                            ids += spam[i].id+",";

                    }

                }

                ids = ids.substr(0, ids.length - 1);

                alert(ids);

            }

為什麼我要用id 這 attribute 因為我測過一些瀏覽器id是最沒有問題的.. 所以改用這偷吃步的方法..

如果有需要請自行改造…
Download Sample Code: