Javascript ASP MVC：获取选中的复选框值，并在选中复选框时获取隐藏的输入总和

我正在为预注册系统创建一个带有表格的ASP页面，其内容如下：

第1栏：等级

第2列：复选框（值由SQL Server动态生成）以及隐藏的输入（值等于主题单位）

第3栏：主题代码

第4栏：主题描述

第5栏：主题单元

第6栏：主题先决条件

页面视图如下所示：

我想做的是通过复选框后面的input hidden值来获得选中复选框的和。因为该复选框的值（主题代码）将在帖子中使用

以下是复选框和隐藏框的格式：

<input type="checkbox" name="BSCS" value="@courses.course_code" onchange="checkUnits()" style="height:16px; width:16px;" />
<input type="hidden" name="BSCS_units" value="@courses.subject_unit" />

我尝试使用javascript，它在文本字段中显示值“NaN”

以下是脚本：

<script>
function checkUnits() {
    document.AdvisingForm.total.value = '';
    var sum = 0;
    var maxUnits = "@Html.Raw(Json.Encode(ViewBag.maxUnit))";
    for (i = 0; i < document.AdvisingForm.BSCS.length; i++) {
        if (document.AdvisingForm.BSCS[i].checked) {
            sum = sum + parseInt(document.AdvisingForm.BSCS_units[i].value);

            if (sum >= +maxUnits + 2) {
                alert("You have already exceeded the maximum number of units required for this semester. Remove one of the courses selected to proceed on next step.");
                $('#course-BSCS').attr('disabled', 'disabled');
            }
            else
            {
                $('#course-BSCS').removeAttr('disabled');
            }
        }      
    }

    document.AdvisingForm.total.value = sum;
}
</script>

函数检查单元（）{
document.AdvisingForm.total.value=''；
var总和=0；
var maxUnits=“@Html.Raw（Json.Encode（ViewBag.maxUnit））”；
对于（i=0；i=+maxUnits+2）{
警告（“您已超过本学期所需的最大单元数。请删除所选课程之一，以便继续下一步。”）；
$（'课程理学学士'）.attr（'禁用'，'禁用'）；
}
其他的
{
$（'课程理学学士'）.removeAttr（'禁用'）；
}
}      
}
document.AdvisingForm.total.value=总和；
}

我真的对剧本部分感到困惑。我怎样才能做到这一点。任何帮助都将不胜感激。非常感谢。

看看这个

var maxUnits = "@Html.Raw(Json.Encode(ViewBag.maxUnit))";

maxUnits变量存储一个字符串。不能使用字符串值进行数值比较

var maxUnits = "450";
var newVal = maxUnits + 2
alert(newVal);

您将看到一个警报

“4502”

，而不是

452

删除双引号

var maxUnits = @Html.Raw(Json.Encode(ViewBag.maxUnit));

我不知道您为什么在ViewBag项目上执行Json.Encode。但是如果在动作方法中为

ViewBag.maxUnit

设置一个整数值，如

ViewBag.maxUnit=4445您可以像这样在javascript（razor视图内部）中直接访问它

var maxUnits = @ViewBag.maxUnit;
alert(maxUnits);

此外，实际上不需要隐藏字段。您可以将当前保留在html5数据格式的隐藏值中的值存储在复选框输入字段本身上

<input type="checkbox" data-unit="@courses.subject_unit" 
                                  name="BSCS" value="@courses.course_code" />

看看这个

var maxUnits = "@Html.Raw(Json.Encode(ViewBag.maxUnit))";

maxUnits变量存储一个字符串。不能使用字符串值进行数值比较

var maxUnits = "450";
var newVal = maxUnits + 2
alert(newVal);

您将看到一个警报
“4502”
，而不是
452

删除双引号

var maxUnits = @Html.Raw(Json.Encode(ViewBag.maxUnit));

我不知道您为什么在ViewBag项目上执行Json.Encode。但是如果在动作方法中为
ViewBag.maxUnit
设置一个整数值，如
ViewBag.maxUnit=4445您可以像这样在javascript（razor视图内部）中直接访问它

var maxUnits = @ViewBag.maxUnit;
alert(maxUnits);

此外，实际上不需要隐藏字段。您可以将当前保留在html5数据格式的隐藏值中的值存储在复选框输入字段本身上

<input type="checkbox" data-unit="@courses.subject_unit" 
                                  name="BSCS" value="@courses.course_code" />

如果我正确理解您的问题，那么下面的示例将帮助您解决问题

您必须为每个复选框和与之相关的隐藏字段指定一个id字段，如下所示

<input type="checkbox" class="ChkCourceCls" name="BSCS" id="@("chkbox_" + courses.course_code)" value="@courses.course_code" onchange="checkUnits()" style="height:16px; width:16px;" />
<input type="hidden" name="BSCS_units" id="@("hdnSubjectUnit_" + courses.course_code)" value="@courses.subject_unit" />



您可以像上面那样指定复选框和隐藏字段，然后在复选框的onchange事件中，您可以找到指定该复选框的特定隐藏字段的值

还有JS

function checkUnits() {
var yourarray = [];

$('input.ChkCourceCls[type=checkbox]').each(function () {


 if($(this).is(':checked'))
{
  yourarray.push($(this).val());// in this array you got all cource code of subjects that are checked by the user.
}

}
var arylen=yourarray.length;
var ToalSubjectunit=0;
for(var i=0;i<arylen;i++)
{
 ToalSubjectunit+= parseInt($("#hdnSubjectUnit_"+yourarray[i]).val());
}
alert(ToalSubjectunit)// here you got the total unit of subject , based on this you can do your validations

}

函数检查单元（）{
var yourray=[]；
$（'input.chkCourcels[type=checkbox]'）。每个（函数（）{
如果（$（this）.is（':checked'））
{
yourarray.push（$（this.val（））；//在这个数组中，您得到了用户检查的所有主题的密码。
}
}
var arylen=yourarray.length；
var ToalSubjectunit=0；
对于（var i=0；i如果我正确理解您的问题，那么下面的示例将帮助您解决问题

您必须为每个复选框和与之相关的隐藏字段指定一个id字段，如下所示

<input type="checkbox" class="ChkCourceCls" name="BSCS" id="@("chkbox_" + courses.course_code)" value="@courses.course_code" onchange="checkUnits()" style="height:16px; width:16px;" />
<input type="hidden" name="BSCS_units" id="@("hdnSubjectUnit_" + courses.course_code)" value="@courses.subject_unit" />



您可以像上面那样指定复选框和隐藏字段，然后在复选框的onchange事件中，您可以找到指定该复选框的特定隐藏字段的值

还有JS

function checkUnits() {
var yourarray = [];

$('input.ChkCourceCls[type=checkbox]').each(function () {


 if($(this).is(':checked'))
{
  yourarray.push($(this).val());// in this array you got all cource code of subjects that are checked by the user.
}

}
var arylen=yourarray.length;
var ToalSubjectunit=0;
for(var i=0;i<arylen;i++)
{
 ToalSubjectunit+= parseInt($("#hdnSubjectUnit_"+yourarray[i]).val());
}
alert(ToalSubjectunit)// here you got the total unit of subject , based on this you can do your validations

}

函数检查单元（）{
var yourray=[]；
$（'input.chkCourcels[type=checkbox]'）。每个（函数（）{
如果（$（this）.is（':checked'））
{
yourarray.push（$（this.val（））；//在这个数组中，您得到了用户检查的所有主题的密码。
}
}
var arylen=yourarray.length；
var ToalSubjectunit=0；
对于（var i=0；i您所说的复选框总数是什么意思？？？是否要将所有受试者的总和取到复选框被选中的位置？因此，当您选中每个复选框时，您必须增加一个变量，简单地说，您需要获得选中复选框的总数？我是对的吗？我们从哪里得到受试者的单位数？当科目的uni需要增加？？为什么单位总是与pic中的3相同？单位和复选框之间的关系是什么？单位的数量也是从数据库中动态生成的。需要增加的只是获取单位总数的文本字段。通常是大学中的所有科目，尤其是辅修科目只有3个单元，相当于1.5个小时的授课时间。单元和复选框之间的关系是，我只需要设置一个学生要学习的最大单元数，以避免课程负担过重，这种情况是针对非正规学生的。因此，选中复选框需要增加总单元的值对于一个学生来说，你可能有有限的单元数，对于每门学科你都有一些单元，根据学科你必须计算总单元数，对吗？？？你指的是什么