微客导航 » 文章资讯 » 使用layui前端框架弹出form表单以及提交的示例

使用layui前端框架弹出form表单以及提交的示例

2023-08-10 09:12:04 171

第一步:引用两个文件

第二步:点击删除按钮弹出提示框

/*删除开始*/
$(".del").click(function(){
varid=$(this).attr("id");
layer.alert('您确定要删除操作吗?',{
skin:'layui-layer-molv'//样式类名自定义样式
,closeBtn:1//是否显示关闭按钮
,anim:1//动画类型
,btn:['确定','取消']//按钮
,icon:6//icon
,yes:function(){
//layer.msg('确定')
$.ajax({
type:"POST",
url:"@Url.Action("Delete","UserInfo")",
data:{id:id},
success:function(Data){
if(Data=="ok"){
location.reload();
}
else{
layer.msg('删除失败')
}
},
error:function(){
alert("出现错误");
returnfalse;
}
})//ajax结束
}
,btn2:function(){
layer.msg('取消')
}
});
})
/*删除结束*/

第三步:放一个添加按钮


添加


ID
姓名
性别
年龄
住址
电话
操作

@foreach(variteminViewData["UserList"]asList)
{

@item.uID
@item.uName
@item.uSex
@item.uAge
@item.uAdress
@item.uPhone
删除
编辑
详情

}

第四步:点击添加按钮弹出form表单填写信息

functionfunc7(){
//页面层
layer.open({
type:1,
skin:'layui-layer-rim',//加上边框
area:['350px','360px'],//宽高

content:"@Url.Action("AddUser","UserInfo")"//调到新增页面
});
}

注意:content的值就是要展示的表单信息或某个页面url，如果要对某个值非空验证就加lay-verify="required"属性。如果是手机号那lay-verify="phone"，数字lay-verify="number"等。

需要数字分页帮助类的留言分享。

以上这篇使用layui前端框架弹出form表单以及提交的示例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
3162201930
czq8825@qq.com

使用layui前端框架弹出form表单以及提交的示例

热门推荐

随机推荐