zoukankan      html  css  js  c++  java
  • MVC项目中使用js 设置Checkbox的选中事件

    要实现的效果是,当点击checkbox时,跳转到Action中

    CheckBox实例:

    View界面:

    @Html.CheckBox("prd.IsChecked", Model.IsChecked,new { data_url = Url.Action("Save", "Home"),ProductID= Model.ProductID })

    注释:new { data_url = Url.Action("Save", "Home"),ProductID= Model.ProductID },要传输的数据

    页面生成:

    <input name="prd.IsChecked" id="prd_IsChecked" type="checkbox" value="true" data-url="/Home/Save" productid="77">

    <input name="prd.IsChecked" type="hidden" value="false">

    注释:MVC中Checkbox控件在页面显示为两条数据

    JS:

    <script src="~/Scripts/jquery-1.4.1.js"></script>

    //引用JS文件

    <script type="text/javascript">

    $(function () {

         $(":checkbox").change(function () {

                 $.ajax({

                       url: $(this).attr('data-url'),

                       type: 'POST',

                       data: { IsChecked: $(this).attr('checked'), ProductID: $(this).attr('ProductID') }

                  });

          });

    });

    </script>

    //$(this).attr('checked'),点击复选框后的当前状态,勾选后界面HTML中会显示checked=‘checked’,获取当前复选框状态(true,false)

    //$(this).attr() :this当前对象,attr()当前对象中的元素 

    Controller:

    [HttpPost]

     Public ActionResult Save(bool IsChecked,int ProductID)

    {

    //选中,取消事件

    }

    //(bool IsChecked,int ProductID):参数名称要与Ajax中的参数名称相对应

  • 相关阅读:
    图书馆管理系统

    有理数类的设计
    题目4-多关键字排序(基于自定义比较函数)
    图总结
    树、二叉树、查找算法总结
    数据结构小结
    C语言文件
    第二次博客作业
    第一次博客作业
  • 原文地址:https://www.cnblogs.com/huangchenqin/p/5332127.html
Copyright © 2011-2022 走看看