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'
                        });
                    });
    
                });
            }
    
        });
    
    }
  • 相关阅读:
    阿里云主机centos设置虚拟内存
    MySQL表名不区分大小写的设置方法
    java.security.KeyException
    Java.net.URLConnection和Apache HTTPClient的主要区别对比
    linux常用命令
    minerd
    kill常用
    阿里云centos 6安装Nginx+PHP+MySQL
    打开MySQL数据库远程访问的权限
    centos 安装MySql 5.6
  • 原文地址:https://www.cnblogs.com/wanlige/p/12461912.html
Copyright © 2011-2022 走看看