Layui表格内使用按钮

Layui表格内使用按钮


效果图


<link href="~/Content/layui/css/layui.css" rel="stylesheet" />
<form class="layui-form">
    <div class="layui-form-item ">
        <label class="layui-form-label">商品ID</label>
        <div class="layui-inline">
            <input type="text" name="T_Goodsid" lay-verify="required" id="T_Goodsid" placeholder="请输入" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-inline">
            <button type="button" class="layui-btn layui-btn-radius" id="queryGoods"> 查询</button>
        </div>
    </div>
    <div class="layui-form-item">
        <table class="layui-hide" id="G_tablebox" lay-filter="G_tablebox"></table>
    </div>
</form>
<script type="text/html" id="IsChange_MT">
    <input type="checkbox" name="IsChange_MT" data-orgid="{
    
    {d.storeid}}" data-branch_name="{
    
    {d.Storename}}" lay-skin="switch" lay-text="开启|关闭" lay-filter="IsChange_MT" {
    
    {
    
    d.IsChange_MT==1?"checked":""}}>
</script>
<script type="text/html" id="IsChange_ELE">
    <input type="checkbox" name="IsChange_ELE" data-orgid="{
    
    {d.storeid}}" data-branch_name="{
    
    {d.Storename}}" lay-skin="switch" lay-text="开启|关闭" lay-filter="IsChange_ELE" {
    
    {
    
    d.IsChange_ELE==1?"checked":""}}>
</script>
<script type="text/html" id="IsChange_JDDJ">
    <input type="checkbox" name="IsChange_JDDJ" data-orgid="{
    
    {d.storeid}}" data-branch_name="{
    
    {d.Storename}}" lay-skin="switch" lay-text="开启|关闭" lay-filter="IsChange_JDDJ" {
    
    {
    
    d.IsChange_JDDJ==1?"checked":""}}>
</script>
<script type="text/html" id="IsChange_JDJK">
    <input type="checkbox" name="IsChange_JDJK" data-orgid="{
    
    {d.storeid}}" data-branch_name="{
    
    {d.Storename}}" lay-skin="switch" lay-text="开启|关闭" lay-filter="IsChange_JDJK" {
    
    {
    
    d.IsChange_JDJK==1?"checked":""}}>
</script>


<script src="~/Content/layui/layui.js" charset="utf-8"></script>
<script>

    layui.use(['form', 'layedit', 'laydate', 'table', 'element'], function () {
    
    
        var form = layui.form,//表单
            $ = layui.$,//jquery
            table = layui.table,//表格
            layer = layui.layer,//基础
            laypage = layui.laypage,//分页
            laydate = layui.laydate,//日期
            util = layui.util;
        var goods = "@ViewData["goodsid"]";
        var data = {
    
    
            goodsid:goods
        };
        $.post("GoodsInventory_Stroe", data, function (rel) {
    
    
            loadTable(JSON.parse(rel));
            });
        function loadTable(data)
        {
    
    
            table.render({
    
    
                elem: '#G_tablebox'
                , height: 520
                , data: data.data//数据接口
                , title: '详情'
                , page: true //开启分页
                , limit: 20
                , defaultToolbar: false//开启工具栏,此处显示默认图标,可以自定义模板,详见文档
                , totalRow: false //开启合计行
                , cols: [[ //表头
                    {
    
     type: 'checkbox', fixed: 'left' }
                    , {
    
     field: 'storeid', title: '门店ID', sort: true }
                    , {
    
     field: 'Storename', title: '门店名称', }
                    , {
    
     field: 'goodsqty', title: '门店库存', }
                    , {
    
     field: 'IsChange_MT', title: '美团同步过滤', templet: '#IsChange_MT', style: "text-align:left", align: "center" ,sort: true, totalRow: true }
                    , {
    
     field: 'IsChange_ELE', title: '饿了么同步过滤', templet: '#IsChange_ELE', style: "text-align:left", align: "center", sort: true, totalRow: true }
                    , {
    
     field: 'IsChange_JDJK', title: '京东健康同步过滤', templet: '#IsChange_JDJK', style: "text-align:left", align: "center", sort: true, totalRow: true }
                    , {
    
     field: 'IsChange_JDDJ', title: '京东到家同步过滤', templet: '#IsChange_JDDJ', style: "text-align:left", align: "center", sort: true, totalRow: true }
                ]], text: {
    
    
                    none: '暂无相关数据' //默认:无数据。注:该属性为 layui 2.2.5 开始新增
                }, done: function (res, curr, count) {
    
    

                }
            });
        }
        //监听配送操作
        form.on('switch(IsChange_ELE)', function (obj) {
    
    
            var alert_value = this.checked ? '1' : '0'; //设置1为开启,0为关闭
            var orgid = $(this).attr("data-orgid");
            var branch_name = $(this).attr("data-branch_name");
            $.ajax({
    
    
                url: 'ChangeFilterState',
                data: {
    
     "orgid": orgid, "IsChange_ELE": alert_value, goodsid: goods },
                beforeSend: function () {
    
    
                    //layer.msg('正在切换' + branch_name + '达达配送的状态' + ',请稍候!');
                },
                error: function (data) {
    
    
                    layer.msg("数据异常,操作失败");
                },
                success: function (data) {
    
    
                    layer.msg(data);
                },
                dataType: 'html'
            });
            return false;//很重要,防止冒泡
        });
        //监听配送操作
        form.on('switch(IsChange_MT)', function (obj) {
    
    
            var alert_value = this.checked ? '1' : '0'; //设置1为开启,0为关闭
            var orgid = $(this).attr("data-orgid");
            var branch_name = $(this).attr("data-branch_name");
            $.ajax({
    
    
                url: 'ChangeFilterState',
                data: {
    
     "orgid": orgid, "IsChange_MT": alert_value, goodsid: goods },
                beforeSend: function () {
    
    
                    //layer.msg('正在切换' + branch_name + '达达配送的状态' + ',请稍候!');
                },
                error: function (data) {
    
    
                    layer.msg("数据异常,操作失败");
                },
                success: function (data) {
    
    
                    layer.msg(data);
                },
                dataType: 'html'
            });
            return false;//很重要,防止冒泡
        });
        //监听配送操作
        form.on('switch(IsChange_JDDJ)', function (obj) {
    
    
            var alert_value = this.checked ? '1' : '0'; //设置1为开启,0为关闭
            var orgid = $(this).attr("data-orgid");
            var branch_name = $(this).attr("data-branch_name");
            $.ajax({
    
    
                url: 'ChangeFilterState',
                data: {
    
     "orgid": orgid, "IsChange_JDDJ": alert_value, goodsid: goods },
                beforeSend: function () {
    
    
                    //layer.msg('正在切换' + branch_name + '达达配送的状态' + ',请稍候!');
                },
                error: function (data) {
    
    
                    layer.msg("数据异常,操作失败");
                },
                success: function (data) {
    
    
                    layer.msg(data);
                },
                dataType: 'html'
            });
            return false;//很重要,防止冒泡
        });
        //监听配送操作
        form.on('switch(IsChange_JDJK)', function (obj) {
    
    
            var alert_value = this.checked ? '1' : '0'; //设置1为开启,0为关闭
            var orgid = $(this).attr("data-orgid");
            var branch_name = $(this).attr("data-branch_name");
            $.ajax({
    
    
                url: 'ChangeFilterState',
                data: {
    
     "orgid": orgid, "IsChange_JDJK": alert_value, goodsid: goods },
                beforeSend: function () {
    
    
                    //layer.msg('正在切换' + branch_name + '达达配送的状态' + ',请稍候!');
                },
                error: function (data) {
    
    
                    layer.msg("数据异常,操作失败");
                },
                success: function (data) {
    
    
                    layer.msg(data);
                },
                dataType: 'html'
            });
            return false;//很重要,防止冒泡
        });

    })
</script>

猜你喜欢

转载自blog.csdn.net/qq_42455262/article/details/120840913