通过Request.Form获取同name的checkbox所有值

转自：http://www.cnblogs.com/Fred_Xu/archive/2013/01/16/how-to-get-the-checkbox-value-from-a-dynamically-generated-checkbox-list-asp-net.html

前端页面需要有一个动态增加表格行的功能，引用了table.addrow.js这个jquery插件，每一行有一个checkbox，name统一为cbMaintainRatio，而鉴于这部分是一个纯Html Form的提交非用户控件，所以我们在后端使用Request.Form来获取值，但问题出来了：

 1 <table border="1" class="atable">
 2             <tbody><tr class="evenRow">
 3                 <th>
 4                     width(px)
 5                 </th>
 6                 <th>
 7                     height(px)
 8                 </th>
 9                 <th>maintain ratio</th>
10                 <th></th>
11             </tr>
12             <tr class="cloneRow9674 oddRow">
13                 <td>
14                     <input type="text" size="25" name="imgwidth">
15                 </td>
16                 <td>
17                     <input type="text" size="25" name="imgheight">
18                 </td>
19                 <td>
20                     <input type="checkbox" name="maintainratio">
21                 </td>
22                 <td class="btnCol">
23                     <input type="button" value="Remove" class="delRow delRow9674" style="display: inline-block;">
24                 </td>
25             </tr><tr class="cloneRow9674 evenRow">
26                 <td>
27                     <input type="text" size="25" name="imgwidth">
28                 </td>
29                 <td>
30                     <input type="text" size="25" name="imgheight">
31                 </td>
32                 <td>
33                     <input type="checkbox" name="maintainratio">
34                 </td>
35                 <td class="btnCol">
36                     <input type="button" value="Remove" class="delRow delRow9674" style="display: inline-block;">
37                 </td>
38             </tr><tr class="cloneRow9674 oddRow">
39                 <td>
40                     <input type="text" size="25" name="imgwidth">
41                 </td>
42                 <td>
43                     <input type="text" size="25" name="imgheight">
44                 </td>
45                 <td>
46                     <input type="checkbox" name="maintainratio">
47                 </td>
48                 <td class="btnCol">
49                     <input type="button" value="Remove" class="delRow delRow9674" style="display: inline-block;">
50                 </td>
51             </tr>
52             <tr class="evenRow">
53             <td colspan="4"><input type="button" value="Add" class="alternativeRow addRow9674"></td>
54             </tr>
55         </tbody></table>

如果我们有多行表单，也就是有多个name为cbMaintainRatio的checkbox，post到后端的form，我们通过Request.Form["cbMaintainRatio"]只能获取到一个值"on"，而不是像<input type="text" name="width" />这种获取到的"100,200,"值。

浏览了一遍addrow插件的文档，他竟然不支持event，好吧...那只能我们自己来改造代码了：

页面增加一个hidden input，目的为保存多个checkbox的值，如果选中则设定为true，否则false，然后用,分割赋值给这个hidden input

 function setMaintainRatio() {

var fields;
$("input[name='cbMaintainRatio']").each(function () {
var txt = $("input[name='cbMaintainRatioList']");
fields = ($("input[name='cbMaintainRatio']").map(function () {
if (this.checked)
return "1";
else
return "0";
}).get().join(","));

$(txt).val(fields);
});

        }

提交Form的按钮绑定上面这个js 方法：

1  <asp:Button ID="btwImageCreate" runat="server" Text="Image Create" OnClick="btwImageCreate_Click" OnClientClick="setMaintainRatio(); return true" />
2         <input type="hidden" name="cbMaintainRatioList" /> 

OK，这样我们就可以在后台代码通过Request.Form的形式获取到每一行这个name="cbMaintainRatio" checkbox的值了！

 

全部和已选择比较 

 1  for (int i = 0; i < Model[0].Count; i++)
 2                     {
 3                         bool c = false;
 4                         for (int j = 0; j < Model[1].Count; j++)
 5                         {
 6                             if (Model[1][j].ButtonID == Model[0][i].ButtonID)
 7                             {
 8                                 c = true;
 9                                 break;
10                             }
11 
12                         }
13                         if (c)
14                         {
15                             <div class="check-box">
16 
17                                 <input name="btns" id="Model[0][i].ButtonID" checked="checked" class="input-text" type="checkbox" style="width: 100px" autocomplete="off" />
18 
19                                 <lable>Model[0][i].Name</lable>
20                             </div>
21                         }
22                         else
23                         {
24                             <div class="check-box">
25 
26                                 <input name="btns" id="Model[0][i].ButtonID" class="input-text" type="checkbox" style="width: 100px" autocomplete="off" />
27 
28                                 <lable>Model[0][i].Name</lable>
29                             </div>
30                         }
31 
32                     }

 

转载于:https://www.cnblogs.com/zhutiehan/p/5648783.html