知识就是力量,时间就是生命。这篇文章主要讲述LayUi的from组件搭配jQuery提交相关的知识,希望能为你提供帮助。
凯哥最近正在学习layui这个后台框架。
先看layui介绍:
layer是一款口碑极佳的web弹层组件,她具备全方位的解决方案,致力于服务各个水平段的开发人员,您的页面会轻松地拥有丰富而友好的操作体验。
本文将介绍layui form组件+jquery提交。
一:页面引入jquery相关:
1.1:引入CSS
文章图片
< link rel="stylesheet" href="https://www.songbingjia.com/android/$path/layui/css/layui.css" media="all">
1.2:引入js
文章图片
< script src="https://www.songbingjia.com/android/$path/layui/layui.js?t=1"> < /script>
注意,js在下面位置放的。
from内容:
文章图片
这里需要记住,from的id为:form_
立即提交的lay-filter是:formSub
下面看看js写法:
layui.config(
base: ../ //静态资源所在路径
).extend(
index: layuiadmin/lib/index //主入口模块
).use([index, form], function()
var $ = layui.$
,admin = layui.admin
,element = layui.element
,form = layui.form;
form.render(null, component-form-element);
element.render(breadcrumb, breadcrumb);
form.on(submit(formSub), function(data)
layer.msg(JSON.stringify(data.field));
$.ajax(
url: /autocode/get-table,
data: $(#form_).serialize(),
type: "POST",
dataType: "json",
success:function (data)
$(data.elem).removeClass(layui-btn-disabled).prop(disabled, false);
if(data.status == 0)
layer.msg(data.message, icon: 6, time: 1000, function()
window.location.href= https://www.songbingjia.com/android/data.data;
);
else
layer.msg(data.message);
);
return false;
);
);
文章图片
说明:
这里的form.on(submit(formSub), function(data)里面submit(提交按钮lay-filter的值)
ajax里面的data: $(#form_).serialize()其中$("form表单的id值")serialize()
【LayUi的from组件搭配jQuery提交】
推荐阅读
- Shell编程之免交互
- Helm快速入门
- 怎么设置tomcat在get请求的中文也不乱码(两种情况下配置)
- 嵌入式交叉编译环境搭建
- linux C/C++编程之库-动态库,静态库创建及使用
- #yyds干货盘点# Docker 安装与启动
- spring boot 测试插件使用及result风格实例1&打包启动.
- Linux安装Terminator
- #yyds干货盘点#「MQ」RabbitMQ的基本概念介绍,通俗易懂!