微客导航 » 文章资讯 » Bootstrap模态框案例解析

Bootstrap模态框案例解析

2024-02-28 07:18:03 371

一.模态框的正常点击出现，如添加功能


添加





×
添加

用户ID

密码

系统ID

是否是管理员否是

删除标志正常删除创建日期

添加关闭

二.还有一种就是编辑，此时在弹出模态框时，里面要写入数据，所以要先取得数据再弹出模态框。这时要加入js代码控制

1.jsp页面


修改




×
修改




NO


用户ID


用户名


密码


系统ID


是否是管理员
否
是



删除标志
正常
删除



创建日期








修改
关闭

2.js代码

/**
*修改用户(将用户信息写入模态框)
*/
functionupdateSystemUser(){
vartempInput=newInput();
tempInput.userId=$('input[name="userId"]:checked').val();
if(tempInput.userId==null){
alert("请选择一条数据来修改");
}else{
varparams=JSON2.stringify(tempInput);
varurl="/emailplatform/system/selectOneUser.xht";
ajaxJson(url,true,params,function(reObject){
//开启模态框
vardialog=$('#systemUpp').modal({
backdrop:'static',
keyboard:false
});
dialog.modal('show');
if(reObject){
$("#no1").val(reObject.data.no);
$("#userId1").val(reObject.data.userId);
$("#userName1").val(reObject.data.userName);
$("#userPwd1").val(reObject.data.userPwd);
$("#systemCode1").val(reObject.data.systemCode);
$("#superFlg1").val(reObject.data.superFlg);
$("#delFlg1").val(reObject.data.delFlg);
$("#createTime1").val(reObject.data.createTime);
}
});
}
}

以上所述是小编给大家介绍的Bootstrap模态框案例解析，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！

返回顶部
3162201930
czq8825@qq.com

Bootstrap模态框案例解析

热门推荐

随机推荐