Question

我的观点包括复选框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);
}

Answer 1

你正在使用jQuery 1.4.4;该版本中尚不存在on。您需要使用bind或升级您的jQuery版本。

除此之外，不要将脚本放在HTML的头部，如果这样做，请务必将它们包装在$(document).ready()中。另外，将委托附加到document等高级别的东西是一个非常糟糕的主意。每次点击都会导致jQuery查询DOM以查看它是否发生在具有类.chks的对象上。您希望将委托附加到您可以逃脱的绝对最近的父级。最后，根据您的代码，您甚至不需要需要代表。只有在将某些内容动态添加到DOM并且仍然需要触发事件处理程序时才使用委托。如果元素就在那里，从页面加载，那么只需将处理程序直接附加到id或类。

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

1 个答案: