zoukankan      html  css  js  c++  java
  • layui弹窗的基本设置+自定义弹窗按钮事件+弹窗中的时间控件+单选框的选中状态改变

    //规划编制添加界面
    function guihuabianzhi() {
        // layui页面弹窗
        layer.open({
            type : 1,
            title : "添加信息",// 弹窗名字
            offset : '0px' // 整体弹窗距离顶端位置
            ,
            id : 'layerDemo' // 防止重复弹出
            ,
            content : $("#detailTable"),
            area : [ '1800px', '800px' ],// 弹窗面积大小设置
            btn : [ '保存', '关闭' ],// 弹窗下方按钮设置
            // 自定义第二个按钮即关闭按钮事件
            btn2 : function() {
                // 设置单选框的第一个值为未选中状态,true则为选中状态
                $('#itemtype input:radio[name=guihua]')[0].checked = false;
                // 设置单选框的第二个值为未选中状态
                $('#itemtype input:radio[name=guihua]')[1].checked = false;
            },
            closeBtn : 0,// 不显示右上角关闭按钮
            btnAlign : 'c' // 按钮居中
            ,
            shade : 0 // 不显示遮罩
            ,
            // 第一个按钮即保存按钮事件
            yes : function() {
                debugger;
                var _url = CTX + "/planmake/addPlanMake";
                // 将前台所有表单值创建成一个对象
                var _params = $("#form_nonstandard").serializeObjectToJson();
                // 创建一个空对象
                var paramsobject = {};
                // 获取input文本框的值
                var itemname = $("#itemnameinput").val();
                // 获取单选框的选择值
                var itemtype = $('#itemtype input[name="guihua"]:checked').val();
                // 为空对象添加值
                paramsobject["itemname"] = itemname;
                // 将自定义的对象参数值赋予ajax的参数
                _params = paramsobject;
                $.ajax({
                    type : "POST",
                    url : _url,
                    data : _params,
                    dataType : "JSON",
                    async : false,
                    success : function(res) {
                        res = $.parseJSON(res);
                        var itemname = $("#itemnameinput").val();
                        debugger;
                        if (itemname == "") {
                            alert("请填写数据!");
                            return false;
                        }
                        if (res.id != "") {
                            showInfo("保存成功!!!");
                        }
                        nonstandardPkid = res.id;
                        debugger;
                        // 重新加载表格列表
                        initnonstandardTable();
                        // 刷新页面,清空页面所有动态添加设置
                        window.location.reload();
                        // 关闭layui所有弹窗
                        layer.closeAll();
                    },
                    error : function(res) {
                        showInfo("保存失败");
                    }
    
                })
    
            },
    
            success : function(layero, index) {
                // 前端页面代码:<input type="text" class="layui-input time" id="starttime"
                // placeholder="请输入时间" >
                // lay时间控件在弹窗中展示
                layui.use('laydate', function() {
                    var laydate = layui.laydate;
                    // 同时绑定多个
                    lay('.time').each(function() {
                        laydate.render({
                            elem : this,
                            trigger : 'click'
                        });
                    });
    
                });
            }
    
        });
    
    }
  • 相关阅读:
    ECC 构筑安全可靠的区块链
    代理模式和装饰者模式
    Context都没弄明白,还怎么做Android开发?
    如何在Android Studio中查看一个类的继承关系呢?
    Android控件的继承关系
    安卓控件体系结构
    Android View框架总结(三)View工作原理
    Laravel中用GuzzleHttp
    学习PHP好,还是Python好呢?
    ElasticSearch入门 第一篇:Windows下安装ElasticSearch
  • 原文地址:https://www.cnblogs.com/wanlige/p/12461912.html
Copyright © 2011-2022 走看看