javascript - 从 div 获取复选框 id 和值的列表并将其传递给 Controller

Question

我得到了一个由我的 View 模型填充的复选框列表。我在复选框元素中指定 id 和值。我需要将这些信息保存在数据库中。目前我拥有它，我获取复选框 id 和复选框值，将它们放入键值对中，我打算对我的 Controller 进行 ajax 调用。有没有更好的方法来做到这一点(mvc)？你会怎么做？谢谢

我的代码:

查看

   <div class = "divSubject">
     @foreach (var item in Model.dictionarySubject)
            {
     <div>
           @Html.CheckBoxFor(model => item.Value, new { @id = item.Key.subjectID})
           @Html.DisplayFor(model => item.Key.subjectName)
    </div>

            }
   </div>

JQuery

 $("#btnSave").click(function () {
 var dict = []; // create an empty array
              $('.divSubject input[type=checkbox]').each(function () {
                  var id = $(this).attr('id')
                  dict.push({
                      key: id,
                      value: $(this).attr('checked')
                  });
                  alert(JSON.stringify(dict))
              });
}

Answer 1

DOM 元素的 id 有一些限制。例如，它不能以数字开头。我建议您使用 HTML5 data-* 属性来保存此元数据信息:

@Html.CheckBoxFor(
    model => item.Value, 
    new { data_id = item.Key.subjectID }
)

然后在你的 JavaScript 中:

$('.divSubject input[type=checkbox]').each(function () {
    var id = $(this).data('id')
    dict.push({
        key: id,
        value: $(this).attr('checked')
    });
    alert(JSON.stringify(dict))
});

除此之外，您的代码看起来不错。