layui中弹出层中将确认按钮变为form表格的提交按钮

layer.open({
		type : 1,
		title : '添加角色',
		area : [ '500px', '350px' ],
		shadeClose : true, // 点击遮罩关闭
		content : html,
		btn : [ '保存', '取消' ],
		success : function(layero, index) { // 成功弹出后回调
			// 解决按enter键重复弹窗问题
			$(':focus').blur();
			// 添加form标识
			layero.addClass('layui-form');
			// 将保存按钮改变成提交按钮
			layero.find('.layui-layer-btn0').attr({
				'lay-filter' : 'addRole',
				'lay-submit' : ''
			});
			// 表单验证
			form.verify({
				roleName : function(value, item) {
					if (!new RegExp("^[a-zA-Z0-9_|\u4e00-\u9fa5\]{2,10}$")
							.test(value)) {
						return '角色名必须为2-10位且不能有特殊字符';
					}
				},
				roleDesc : function(value, item) {
					if (!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\]{2,200}$")
							.test(value)) {
						return '角色描述必须为2-200位且不能有特殊字符';
					}
				}
			});
			// 刷新渲染(否则开关按钮会不显示)
			form.render('checkbox');
		},
		yes : function(index, layero) { // 确认按钮回调函数
			// 监听提交按钮
			form.on('submit(addRole)', function(data) {
			});
		},
		btn2 : function(index, layero) { // 取消按钮回调函数
			layer.close(index); // 关闭弹出层
		}
	});

要想将保存按钮变为表单提交的按钮我们需要在success函数中加入

 然后我们就可以使用layui的监听事件监听到提交按钮了

猜你喜欢

转载自blog.csdn.net/qq_37059367/article/details/83110164
今日推荐