onoffswitch-checkbox

  @foreach (EmailSubscription es in Model)
   {

if(true){

<div class="onoffswitch">                     
        <input type="checkbox" checked class="onoffswitch-checkbox" name="onoffswitch_1" id="onoffswitch_1">
        <label class="onoffswitch-label" style="border-radius:23px;" name="onoffswitch_1" for="onoffswitch_1">
            <span class="onoffswitch-inner"></span>
            <span class="onoffswitch-switch" style="width:24px;border-radius:12px;"></span>
         </label>
 </div>

}

else

{

        <input type="checkbox"  class="onoffswitch-checkbox" name="onoffswitch_1" id="onoffswitch_1">
        <label class="onoffswitch-label" style="border-radius:23px;" name="onoffswitch_1" for="onoffswitch_1">
            <span class="onoffswitch-inner"></span>
            <span class="onoffswitch-switch" style="width:24px;border-radius:12px;"></span>
         </label>

}

}

js中对多个onoffswitch-switch 按钮 进行数组形式的赋值

<script type="text/javascript"> 

$(document).ready(function(){

       var active= new Array();
        var num= new Array();
        var i = 0;
        $("label[name^='onoffswitch_']").on('click',function (e) {

            var id = $(this).attr("name").split("_")[1];
            var onswitch= document.getElementById("onoffswitch_" + id).checked;
            if (onswitch)
            {
                active[i] = "false";
            }
            else
            {
                active[i] = "true";
            }
            num[i] = id;
            i++;
        });

 

        $("#btnSave").click(function () {

            if (active.length>0 && num.length>0)
            {
                $(".ajax-loader").show();

                $.ajax({
                    url: ' ',
                    traditional: true,    //阻止深度序列化,提交时后台处理才能接收到数组值。默认为 false,提交数组必须为true
                    data:
                    {
                        active: active,
                        num: num
                    },
                    complete: function () {
                        $(".ajax-loader").hide();
                    }
                });
            }
        });

});

</script>

c# 里:control里数组接受和处理,接收数组, 避免未修改时更新数据库

        public ActionResult SaveSubscriptions(string[] active, string[] num)
        {
            bool Isonline = false;
            List<Num> list = _numService.GetNumByCustomerID(logginUser.UserID).ToList();
            if (list.Count>0)
            {
                for (int i = 0; i < IsOnline.Length; i++)
                {               
                    var num = new Guid(num[i]);
                    num result = list.Where(a => a.ID == num).FirstOrDefault();
                    if(result.active != Boolean.Parse(active[i]))
                    {
                        if (active[i] == "true")
                        {
                            active = true;
                        }
                        else
                        {
                           active = false;
                        }

                        list.Add(result);
                        active= true;
                    }
                }
            }
            if (active)
            {
                _numService.UpdateNum(list);
            }   
           
            return RedirectToAction("Index");
        }

                       

转载于:https://www.cnblogs.com/yi-miao/p/8058109.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uniapp是一个基于Vue.js的跨平台开发框架,可以用于开发iOS、Android、H5等多个平台的应用程序。u-checkbox-group和u-checkbox是uniapp中的两个组件,用于实现多选功能和数据回显。 u-checkbox-group是一个多选框组的容器,可以包含多个u-checkbox组件。它通过v-model绑定一个数组来实现数据的双向绑定。当用户选择或取消选择某个u-checkbox时,对应的数据会自动添加或移除到绑定的数组中。 u-checkbox是一个单个的多选框,可以通过v-model绑定一个布尔值来表示是否选中。当用户选择或取消选择该多选框时,绑定的布尔值会自动更新。 要实现数据回显,首先需要在data中定义一个数组来存储选中的数据。然后,在u-checkbox-group中使用v-model绑定该数组。当需要回显数据时,只需要将对应的数据添加到数组中即可。 以下是一个示例代码: ``` <template> <view> <u-checkbox-group v-model="selectedItems"> <u-checkbox v-for="item in items" :key="item.id" :label="item.id" :value="item.name">{{ item.name }}</u-checkbox> </u-checkbox-group> <button @click="showSelectedItems">显示选中的数据</button> </view> </template> <script> export default { data() { return { items: [ { id: 1, name: '选项1' }, { id: 2, name: '选项2' }, { id: 3, name: '选项3' } ], selectedItems: [] }; }, methods: { showSelectedItems() { console.log(this.selectedItems); } } }; </script> ``` 在上面的示例中,items数组存储了所有的选项数据,selectedItems数组用于存储选中的数据。当用户选择或取消选择某个选项时,selectedItems数组会自动更新。点击"显示选中的数据"按钮时,会将选中的数据打印到控制台。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值