我想在项目中添加多个复选框,用于定义项目的角色和权限。
请参阅我的以下CSHTML和jQuery代码。
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:
<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>
我的问题是我希望能够使用自己的id动态添加多个复选框值;我该怎么做?
答案 0 :(得分:1)
试试这个:
在页面上添加隐藏字段,并尝试将值存储在隐藏字段中。 通过使用View to controller,所以需要隐藏字段。我希望这对你有所帮助。
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的:
$("#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;
}
});