我可以显示已选中的复选框,但我想在部分视图_GetDetailsProfileTab中显示未选中的复选框。
我有这个用于ckecked复选框:
<table width="550">
<tr>
<td><h6>NAME</h6></td>
<td><h6>COUNTRY</h6></td>
<td><h6>DIFFICULT LEVEL</h6></td>
</tr>
@{
foreach (var climb in Model.Climbs)
{
<tr>
<td>@climb.Name</td>
<td>@climb.country.country_name </td>
<td>@climb.difficult.DifficultName</td>
</tr>
}
}
<tr><th><br /></th></tr>
<tr>
<td>@Model.Climbs.Count</td> of
</tr>
</table>
但如何显示未选中的复选框?
例如,我无法使用它:
$(document).ready(function () {
var numSelected = $("input.mycheckBox:checked").length;
alert(numSelected)
});
部分视图中的:_GetDetailsProfileTab,因为ckeckbox在其他局部视图中定义。在_GetDetailsProfileTab,Detial视图中,用户只能通过他/她的个人资料查看用户选中的复选框。
这是视图,用户可以在其中选中复选框(_GetClimbTab):
@model ContosoUniversity.Models.UserProfile
@using ContosoUniversity.Source
@{
ViewBag.Title = "GetClimbs";
}
@using (Html.BeginForm("GetClimbs", "Account", FormMethod.Post, new { id = "form_Id", enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal" id="chexkboxes">
@Html.HiddenFor(model => model.Id)
<table border="0">
<tr>
@{
int cnt = 0;
List<ContosoUniversity.ViewModels.AssignedClimb> climbs = ViewBag.Climbs;
foreach (var climb in climbs)
{
if (cnt++ % 1 == 0)
{
@:</tr><tr>
}
@:<td>
<input type="checkbox"
id="toggleAll"
name="selectedClimbs"
class="mycheckBox"
value="@climb.ClimbID"
@(Html.Raw(climb.Assigned ? "checked=\"checked\" " : " ")) />
@climb.Title @: - @climb.NameCountry - @climb.DifficultName
@:</td>
}
@:</tr>
}
</table>
<input type="checkbox" name="Test" onclick="SetAllCheckBoxes(this)" /><span>Check All</span>
</div>
<br />
<div class="pull-left">
<div class="col-md-offset-0">
<input type="submit" value="Save" id="toastr-success" class="btn btn-default pull-left" />
</div>
</div>
}
<br /><br />
<div>
@Html.ActionLink("Back to List", "Index")
</div>
因为最终结果必须是:你从y中选择了x
所以我试试这个:
<table width="550">
<tr>
<td><h6>NAME</h6></td>
<td><h6>COUNTRY</h6></td>
<td><h6>DIFFICULT LEVEL</h6></td>
</tr>
@{
List<ContosoUniversity.Models.Climb> climbs = new List<ContosoUniversity.Models.Climb>();
foreach (var climb in Model.Climbs)
{
<tr>
<td>@climb.Name</td>
<td>@climb.country.country_name </td>
<td>@climb.difficult.DifficultName</td>
</tr>
}
}
<tr><th><br /></th></tr>
<tr>
<td>@Model.Climbs.Count</td>
<td>@climbs.Capacity.ToString() </td>
</tr>
</table>
但<td>@climbs.Capacity.ToString() </td>
每次都是0.那么如何获得攀爬总数(已检查和未选中)?
谢谢
这适用于(编辑)视图:
<div id="tabs">
<ul>
<li><a href="#tabs-1">Personal information</a></li>
<li><a href="#tabs-2">Profile Photo</a></li>
<li><a href="#tabs-3">Other Photos</a></li>
<li><a href="#tabs-4">Climb</a></li>
<li><a href="#tabs-5">route</a></li>
</ul>
<div id="tabs-1">
@Html.Partial("_GetUserProfile", Model)
</div>
<div id="tabs-2">
@Html.Partial("_GetProfilePicture", Model)
</div>
<div id="tabs-3">
@Html.Partial("_GetOtherImages", Model)
</div>
<div id="tabs-4">
@Html.Partial("_GetClimbTab", Model)
</div>
<div id="tabs-5">
@Html.Partial("_GetRouteTab", Model)
</div>
</div>
@section Scripts
{
<link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.11.0.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.form.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.10.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/bootstrap-filestyle.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.form.min.js")" type="text/javascript"></script>
<script>
$(document).ready(function () {
var numSelected = $("input.mycheckBox:checked").length;
var numNotSelected = $("input.mycheckBox:not(:checked").length;
var total = numSelected + numNotSelected;
alert("not checked:" + numNotSelected);
alert("You checked:" + numSelected);
alert("total of checkboxes are: " + total);
});
因为在GetClimbTab中定义了checbox。
但这不起作用(明细)视图:
<div id="tabs">
<ul>
<li><a href="#tabs-1">Profile</a></li>
<li><a href="#tabs-2">Photos</a></li>
</ul>
<div id="tabs-1">
@Html.Partial("_GetDetailsProfileTab", Model)
</div>
<div id="tabs-2">
@Html.Partial("_GetDetailsPhotoTab", Model)
</div>
</div>
@*<h2>Details</h2>*@
@section Scripts{
<link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/Progressbar.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-ui-1.10.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/Progressbar.js")" type="text/javascript"></script>
<script>
$(document).ready(function () {
//var Id = $("#Id").val();
$.get('@Url.Action("Edit", "Account")', function (data) {
// data is your partial HTML, $data is your jQuery object containing partial
//var $data = $(data);
$("#_GetClimbTab").html(data);
var numSelected = $("input.mycheckBox:checked").length;
alert(numSelected);
});
alert(numSelected); is everytime 0
答案 0 :(得分:0)
您可以使用:not
获取未选中的复选框,请参阅下面的代码
$(document).ready(function () {
var numSelected = $("input.mycheckBox:not(:checked)").length;
alert(numSelected)
});
答案 1 :(得分:0)
在从服务器收到部分视图后,您应该将计数复选框逻辑设置为逻辑。例如:
$.get("http://Partial/GetOne", function(data){
// data is your partial HTML, $data is your jQuery object containing partial
var $data = $(data);
var numSelected = $data.find("input.mycheckBox:not(:checked)").length;
alert(numSelected);
});