在当前会话/运行中存储复选框状态

Storing checkboxes state in current session/run

本文关键字：存储 复选框 状态 运行 会话      更新时间：2023-09-26

我的视图包括复选框clickevent侦听器，它应该在每次复选框状态被更改时触发:

<html>
    <head>
        <script type="text/javascript" src="~/scripts/jquery.unobtrusive-ajax.js"></script>
        <script type="text/javascript" src="~/scripts/jquery-1.4.4.js"></script>
        <title>TestChckBox</title>
        <script type="text/javascript">
            $(function () {
                $(document).on("click", "input.chks", function (e) {
                    var _this = $(this);
                    var isChecked = _this.is(':checked');
                    $.post("@Url.Action("UpdateInput","Search")?id=" + _this.attr("id") +
                                          "&newValue=" + isChecked, function (data) {
                                              // response stuff should be here
                                          });
        });
    });
</script>

    </head>

——

       @if (ViewBag.SliceList != null)
        {
            @*foreach(Pirsum.Models.HourSlice slice in this.Model) {*@
            foreach (var slice in ViewBag.SliceList) {
                <div  class="row">

          <input class="chks" type="checkbox" id="@HtmlHelper.GenerateIdFromName("cb_slice." + @slice.SliceID)" />
                    <label for="@HtmlHelper.GenerateIdFromName("cb_slice." + @slice.SliceID)">@slice.SliceName</label>
                    <span class="info">@slice.StartTime - @slice.EndTime</span>
                </div>
            }
        }
              <input type="submit" value="Submit" />
       }
            </body>
        </html>

div用几个复选框和字符串正确填充，这些复选框和字符串来自于将viewbag中的项传递给视图的操作。

问题是上面的函数不起作用，当复选框被点击时，"UpdateInput"不会在搜索控制器中被触发，也不会在客户端发生任何点击事件。

我做错了什么?以及如何保存复选框状态(选中和未选中)正确在会话或在任何其他选项中，我可以临时保存在运行时设置的选中参数?

控制器动作参考，这一个发送数据到主体(相关的复选框和其他一些数据的问题)

public ActionResult TestChckbox()
{
    int iInstId = 1;
    Test.Models.DataLayer db = new Test.Models.DataLayer();
    Test.Models.TestDB.context = new Models.TestDB();
    IEnumerable<Test.Models.HourSlice> lst = db.GetSlices(context, iInstId).OrderBy(a => a.SliceID);
    ViewBag.SliceList = lst;
    return View(lst);
}

当选中/取消选中复选框时，该操作应该以复选框状态运行:

[HttpPost]
public ActionResult UpdateInput(int id, bool newValue)
{
    //do your saving here.
    return Json(true);
}

你正在使用jQuery 1.4.4;on在那个版本中还不存在。你需要使用bind或者升级你的jQuery版本。

除此之外，不要把脚本放在HTML的头部，如果你这样做，一定要把它们包装在$(document).ready()中。此外，将委托附加到document这样高级别的东西上是一个非常糟糕的主意。每次点击，在任何地方，都会导致jQuery查询DOM，看看它是否发生在类.chks的对象上。你想要将委托附加到最接近父节点的父节点。最后，根据你的代码，你甚至不需要委托。只有当某些东西将被动态添加到DOM并且仍然需要触发事件处理程序时才使用委托。如果元素正好在那里，从页面加载，那么只需将处理程序直接附加到id或类。

相关文章：