jQuery自动生成的多个复选框列表
[英]Multiple checkbox lists auto-generated by jQuery
问题描述
I want to add multiple checkboxes to my project which are used to define role and rights for my project. 
我想向我的项目添加多个复选框，这些复选框用于定义项目的角色和权限。
Please see my following CSHTML and jQuery code. 请查看我下面的CSHTML和jQuery代码。
CSHTML code : CSHTML代码：
@using (@Html.BeginForm())
{
<table cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td>
<div class="content" style="background-color: #fff; margin-top: 20PX;">
<div class="page-header">
<div style="float: left; margin: 0PX; padding: 0px;">
<h1>
Web Menu Rights
</h1>
</div>
</div>
<div style="margin-left: 10px">
<b class="lblblack">Department Name : </b>
@Html.DropDownList("DEPARTMENT", null, "--Select One--", new { style = "width: 280px", @id = "DEPARTMENT", @name = "DEPARTMENT" })
<input type="button" id="btnView" name="btnView" value="View" class="btn btn-flat btn-primary" />
</div>
<div class="page-container" id="page_BCEBC">
<div class="row" style="margin-left: 20px;">
<table cellpadding="2" cellspacing="0" width="80%" class="gridview">
<tbody>
<tr>
<td style="text-align: left;">
<h3>
Main Menu</h3>
</td>
<td>
</td>
</tr>
<tr>
<td style="text-align: right; width: 400px;">
<b class="lblblack">Title :</b>
</td>
<td>
<b class="lblblack">Is Display</b>
</td>
</tr>
@foreach (var a in ViewBag.List_H)
{
var obj_id = @a.OBJECT_ID;
var chkView = "chkView_";
<tr id="trobjname_B">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_b">
<input id="hfObjId_B" name="hfObjId_B" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_B == 1)
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" />
}
</td>
</tr>
}
<tr>
<td style="text-align: left;">
<h3>
Quick Links</h3>
</td>
<td>
</td>
</tr>
@foreach (var a in ViewBag.List_D)
{
var obj_id = @a.OBJECT_ID;
var chkView = "chkView_";
<tr id="trobjname_B">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_b">
<input id="hfObjId_B" name="hfObjId_B" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_B == 1)
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" />
}
</td>
</tr>
}
<tr>
<td>
</td>
<td align="left">
<input id="btnSave" type="submit" value="Save" name="btnSave" class="btn btn-flat btn-primary" />
<input id="btncancel" name="btncancel" type="submit" value="Cancel" class="btn btn-flat btn-danger" onclick="window.location = '@Url.Action("Web_Menu_Rights", "web_portal_entry")'; return false;" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="page-container" id="page_FDC">
<div class="row" style="margin-left: 20px;">
<table cellpadding="2" cellspacing="0" width="80%" class="gridview">
<tbody>
<tr>
<td style="text-align: left;">
<h3>
Main Menu</h3>
</td>
<td>
</td>
</tr>
<tr>
<td style="text-align: right; width: 400px;">
<b class="lblblack">Title :</b>
</td>
<td>
<b class="lblblack">Is Display</b>
</td>
</tr>
@foreach (var a in ViewBag.List_H)
{
var obj_id = @a.OBJECT_ID;
var chkView2 = "chkView2_";
<tr id="trobjname_F">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_f">
<input id="hfObjId_F" name="hfObjId_F" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_F == 1)
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" />
}
</td>
</tr>
}
<tr>
<td style="text-align: left;">
<h3>
Quick Links</h3>
</td>
<td>
</td>
</tr>
@foreach (var a in ViewBag.List_D)
{
var obj_id = @a.OBJECT_ID;
var chkView2 = "chkView2_";
<tr id="trobjname_F">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_f">
<input id="hfObjId_F" name="hfObjId_F" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_F == 1)
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" />
}
</td>
</tr>
}
<tr>
<td>
</td>
<td align="left">
<input id="btnSave2" type="submit" value="Save" name="btnSave2" class="btn btn-flat btn-primary" />
<input id="btncancel2" name="btncancel" type="submit" value="Cancel" class="btn btn-flat btn-danger" onclick="window.location = '@Url.Action("Web_Menu_Rights", "web_portal_entry")'; return false;" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
}
jQuery : jQuery的：
<script type="text/javascript">
$(document).ready(function () {
$("#btnSave").click(function () {
var cnt = $("input:checked").length;
if (cnt > 0) {
var Add = "";
$("#trobjname_B,#dept_id_b").each(function () {
var id_chkView = $(this).find('.chkView').attr('id');
var isView = $('#' + id_chkView).is(':checked') ? "1" : "0";
????
});
}
else {
return false;
}
});
});
</script>
My problem is that I want be able to dynamically add multiple check box values with their own id; 我的问题是我希望能够动态添加具有其自身ID的多个复选框值； how would I do this? 我该怎么做？
1 个解决方案
解决方案1
1 已采纳 2014-06-09 05:57:26
Try this: 尝试这个：
Add hidden field on your page and try to store value in hidden field. 在页面上添加隐藏字段，然后尝试在隐藏字段中存储值。 by using View to controller so there is need of hidden field. 通过使用View来控制，因此需要隐藏字段。 i hope this will help for you. 希望对您有帮助。
CSHTML : CSHTML：
<table cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td>
<input type="hidden" id="hidObjects_B" name="hidObjects_B" />
<input type="hidden" id="hidObjects_F" name="hidObjects_F" />
<div class="content" style="background-color: #fff; margin-top: 20PX;">
<div class="page-header">
<div style="float: left; margin: 0PX; padding: 0px;">
<h1>
Web Menu Rights
</h1>
</div>
</div>
<div style="margin-left: 10px">
<b class="lblblack">Department Name : </b>
@Html.DropDownList("DEPARTMENT", null, "--Select One--", new { style = "width: 280px", @id = "DEPARTMENT", @name = "DEPARTMENT" })
<input type="button" id="btnView" name="btnView" value="View" class="btn btn-flat btn-primary" />
</div>
<div class="page-container" id="page_BCEBC">
<div class="row" style="margin-left: 20px;">
<table cellpadding="2" cellspacing="0" width="80%" class="gridview">
<tbody>
<tr>
<td style="text-align: left;">
<h3>
Main Menu</h3>
</td>
<td>
</td>
</tr>
<tr>
<td style="text-align: right; width: 400px;">
<b class="lblblack">Title :</b>
</td>
<td>
<b class="lblblack">Is Display</b>
</td>
</tr>
@foreach (var a in ViewBag.List_H)
{
var obj_id = @a.OBJECT_ID;
var chkView = "chkView_";
<tr id="trobjname_B">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_b">
<input id="hfObjId_B" name="hfObjId_B" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_B == 1)
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" />
}
</td>
</tr>
}
<tr>
<td style="text-align: left;">
<h3>
Quick Links</h3>
</td>
<td>
</td>
</tr>
@foreach (var a in ViewBag.List_D)
{
var obj_id = @a.OBJECT_ID;
var chkView = "chkView_";
<tr id="trobjname_B">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_b">
<input id="hfObjId_B" name="hfObjId_B" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_B == 1)
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView@obj_id" class="chkView" />
}
</td>
</tr>
}
<tr>
<td>
</td>
<td align="left">
<input id="btnSave" type="submit" value="Save" name="btnSave" class="btn btn-flat btn-primary" />
<input id="btncancel" name="btncancel" type="submit" value="Cancel" class="btn btn-flat btn-danger" onclick="window.location = '@Url.Action("Web_Menu_Rights", "web_portal_entry")'; return false;" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="page-container" id="page_FDC">
<div class="row" style="margin-left: 20px;">
<table cellpadding="2" cellspacing="0" width="80%" class="gridview">
<tbody>
<tr>
<td style="text-align: left;">
<h3>
Main Menu</h3>
</td>
<td>
</td>
</tr>
<tr>
<td style="text-align: right; width: 400px;">
<b class="lblblack">Title :</b>
</td>
<td>
<b class="lblblack">Is Display</b>
</td>
</tr>
@foreach (var a in ViewBag.List_H)
{
var obj_id = @a.OBJECT_ID;
var chkView2 = "chkView2_";
<tr id="trobjname_F">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_f">
<input id="hfObjId_F" name="hfObjId_F" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_F == 1)
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" />
}
</td>
</tr>
}
<tr>
<td style="text-align: left;">
<h3>
Quick Links</h3>
</td>
<td>
</td>
</tr>
@foreach (var a in ViewBag.List_D)
{
var obj_id = @a.OBJECT_ID;
var chkView2 = "chkView2_";
<tr id="trobjname_F">
<td style="text-align: right; width: 200px;">
<b class="lblblack">@a.OBJECT_NAME :</b>
</td>
<td style="text-align: left;" id="dept_id_f">
<input id="hfObjId_F" name="hfObjId_F" type="hidden" value="@obj_id" />
@if (@a.DEPT_ID_F == 1)
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" checked="checked"/>
}
else
{
<input type="checkbox" id="@chkView2@obj_id" class="chkView2" />
}
</td>
</tr>
}
<tr>
<td>
</td>
<td align="left">
<input id="btnSave2" type="submit" value="Save" name="btnSave2" class="btn btn-flat btn-primary" />
<input id="btncancel2" name="btncancel" type="submit" value="Cancel" class="btn btn-flat btn-danger" onclick="window.location = '@Url.Action("Web_Menu_Rights", "web_portal_entry")'; return false;" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
Jquery: jQuery的：
$("#btnSave").click(function () {
var cnt = $("input:checked").length;
if (cnt > 0) {
var Add = "";
$("#trobjname_B > #dept_id_b").each(function () {
var id_chkView = $(this).find('.chkView').attr('id');
var isView = $('#' + id_chkView).is(':checked') ? "1" : "0";
Add += $(this).find("#hfObjId_B").val() + "!";
Add += isView + "$";
});
$("#hidObjects_B").val(Add);
}
else {
alert("Please check atleast one checkbox");
return false;
}
});
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
jQuery onClick自动生成的表不起作用 - JQuery onClick auto-generated table not working
使用Javascript / JQuery解析自动生成的.NET日期对象 - Parsing a Auto-Generated .NET Date Object with Javascript/JQuery
自动生成的Weebly侧边菜单，可能带有JavaScript或jQuery - Auto-Generated Side Menu for Weebly, perhaps with JavaScript or jQuery
自动生成的图像不可点击 - Auto-Generated images are not clickable
自动生成的表单值 - Auto-generated Form Value
如何在ReactJS中制作自动生成的ID - How to make auto-generated ID in ReactJS
CKEditor内联重新排列自动生成的工具栏 - CKEditor inline rearrange auto-generated toolbar
自动生成元素上的不显眼的 JavaScript 事件 - Unobtrusive JavaScript event on auto-generated elements
自动生成的表单的AngularJS表单验证 - AngularJS form validatation of auto-generated form
Gigya-完成自动生成帐户的注册 - Gigya - complete registration for an auto-generated account
相关标签