0

我的视图包括复选框 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 正确填充了几个复选框和字符串，这些复选框和字符串来自将视图包中的项目传递到视图的操作。

问题是上面的功能不起作用，并且当单击复选框或客户端上的任何单击事件时，搜索控制器中没有触发“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);
}
4

1 回答 1

0

You're using jQuery 1.4.4; on didn't exist yet in that version. You need to use bind or upgrade your version of jQuery.

Other than that, don't put scripts in the head of your HTML and if you do, definitely wrap them in $(document).ready(). Also, it's a hugely bad idea to attach a delegate to something as high-level as document. Every click, everywhere, will cause jQuery to query the DOM to see if it happened on an object with class .chks. You want to attach the delegate to the absolute closest parent you can get away with. Finally, based on your code you don't even need a delegate. Only use delegates when the something will be dynamically added to the DOM and still needs to trigger event handlers. IF the element is just there, from page load, then just attach the handler directly to the id or class.

于 2013-05-02T14:32:16.880 回答