javascript - ASP MVC : Getting checked checkbox value and getting sum of input hidden when checkbox is checked

Question

我正在为预注册系统创建一个表格形式的ASP页面，内容如下:

第 1 栏:成绩

第 2 列:复选框(值从 SQL Server 动态生成)以及隐藏的输入(值等于主题单位)

第 3 列:主题代码

第 4 栏:主题描述

第 5 栏:主题单元

第 6 栏:科目先决条件

页面 View 在这里: Page view

我想要发生的是通过复选框后面的隐藏输入值来获取选中复选框的总和。由于复选框的值(主题代码)将在帖子中使用。

这是复选框和隐藏的格式:

<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>

我对脚本部分真的很困惑。我怎样才能完成这个任务呢。任何帮助将不胜感激。非常感谢。

Answer 1

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

您必须为每个复选框和与其关联的隐藏字段提供一个 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

}

注意:您还可以使用名称属性代替类名。我只提供了示例代码，您可以根据自己的逻辑和需求对此代码进行更改