Question

MVC 5 - Razor，Javascript 新手用户!!

我希望能够在表中更改复选框时运行简单的onchange事件，但onchange仅适用于第一行。

我已经读过这是因为脚本只在第一行运行，而不是为后续动态填充的数据运行。

我理解这一点，但不知道如何修复它......我假设我需要为每一行中的每个复选框创建一个单独的ID - 我不知道该怎么做。

此外，当复选框具有不同的ID时，我不知道如何引用它们来添加onchange。

希望这是有道理的。提前谢谢。

Throwable cause = ex.getCause(); // this is your Exception("Hello")

Answer 1

在CheckBoxFor中用class替换id：

<td class="vert-align">
    @Html.CheckBoxFor(modelItem => item.Selected, new {@class= "CheckBoxSelected"})
</td>

在Javascript代码中使用以下代码：

(function($) {
    var onChanged = function(){
        /*Do smth that you needed*/
    };  
    $(function() {
        $(".checkbox").on("change", onChanged)
    });
}(jQuery));

Answer 2

因为所有输入框都具有相同的Id值“CheckBoxSelected”。这是无效的标记。 Id值应该是唯一的。

您可以考虑从标记中删除id并使用css类。

 @Html.CheckBoxFor(modelItem => item.IsSelected, new { @class = "mycheckBox" })

并使用jQuery库，使用此css类侦听输入元素上的change事件。

$(function(){

   $("input.mycheckBox").change(function(){
      var isSelected = this.checked;
      alert("Checkbox changed");



      if (isSelected ) {
        $("#noSelected").val( parseInt($("#noSelected").val())+ 1));
      }
      else
      {
        $("#noSelected").val( parseInt($("#noSelected").val()) -  1));
      }
   });

});

假设标识为noSelected的输入的当前值为数值（否则parseInt将失败）。

为表中的每一行运行OnChange事件 - MVC

2 个答案: