用于辅助在 bootstrap-dialog 中的表现:app-jquery-dialog.js
// 用于通某个元素共享配置数据
$.extend($.fn, {
formOption : function(showOpt) {
var opt = $.data(this[0], "formOpt"); var settings;
if (opt) {
settings = $.extend({}, opt, showOpt);
} else {
settings = showOpt;
} $.data(this[0], "formOpt", settings);
},
getFormOpt : function() {
if (this[0] != undefined) {
var opt = $.data(this[0], "formOpt");
if (opt != undefined && opt != null)
return opt;
}
return {};
}
}) $.FORM = {
showConfirm : function(showOpt) {
var opt = {
title : showOpt.title,
message : showOpt.message,
draggable : true,
closeByBackdrop : false,
type : BootstrapDialog.TYPE_WARNING,
buttons : [
{
id : "btn-confirm",
icon : 'glyphicon glyphicon-saved',
label : '确定',
cssClass : 'btn-warning',
action : function(dialogItself) {
if (showOpt.url != undefined) {
$.HTTP
.obj({
type : showOpt.ajaxType == undefined ? 'post'
: showOpt.ajaxType,
url : showOpt.url,
ajaxData : showOpt.ajaxData,
success : function(json) {
if (showOpt.autoClose) {
dialogItself.close();
$.NOTIFY
.showSuccess(
showOpt.successTitle,
showOpt.successMessage);
} else {
dialogItself
.setTitle(showOpt.successTitle);
dialogItself
.setMessage(showOpt.successMessage);
dialogItself
.setType(BootstrapDialog.TYPE_SUCCESS);
dialogItself
.setButtons([ {
icon : 'glyphicon glyphicon-saved',
label : '确定',
cssClass : 'btn-success',
action : function(
d) {
d.close();
}
} ]);
} if (showOpt.onSuccess)
showOpt.onSuccess(json);
}
})
} else {
if (showOpt.onConfirm(dialogItself)) {
dialogItself.close();
}
} }
}, {
icon : 'glyphicon glyphicon-ban-circle',
label : '取消',
action : function(dialogItself) {
dialogItself.close();
}
} ]
}; var dialog = BootstrapDialog.show(opt);
return dialog;
},
/**
* title,isReadOnly,postUrl,data,dataSource,fields,properties,dependencies ,
* formNodeCallback 收集表单信息回调
*/
showFormDialog : function(showOpt) { var dialog;
var buttons;
var showD = function(showOpt, data) {
if (showOpt.isReadOnly != undefined && showOpt.isReadOnly != null) {
if (showOpt.isReadOnly) {
// 只读模式
} else {
// 修改模式
buttons = [ {
icon : 'glyphicon glyphicon-saved',
label : '修改',
cssClass : 'btn-primary',
action : function(dialogItself) {
$.FORM.postForm(showOpt, dialogItself);
}
}, {
icon : 'glyphicon glyphicon-ban-circle',
label : '取消',
action : function(dialogItself) {
dialogItself.close();
}
} ];
}
} else {
// 添加模式
buttons = [ {
icon : 'glyphicon glyphicon-saved',
label : '保存',
cssClass : 'btn-primary',
action : function(dialogItself) {
$.FORM.postForm(showOpt, dialogItself);
}
}, {
icon : 'glyphicon glyphicon-ban-circle',
label : '取消',
action : function(dialogItself) {
dialogItself.close();
}
} ];
} dialog = $.FORM.showDialog(showOpt, buttons, data); } // 如果有数据先加载数据
if (showOpt.dataSource != undefined && showOpt.dataSource != null) {
$.ajax({
type : "get",
async : false,
url : showOpt.dataSource,
contentType : 'application/json',
dataType : "json",
success : function(json) {
if (json.stat == 1) {
showD(showOpt, json.data);
} else {
if (json.code != undefined) {
$.FORM.show_code_err(dialog, json);
} else {
$.FORM.show_sys_err(dialog);
return;
}
}
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
var info = "XMLHttpRequest:"
+ JSON.stringify(XMLHttpRequest) + " ;textStatus:"
+ textStatus + "; errorThrown:"
+ JSON.stringify(errorThrown) + "; 【"
+ showOpt.postUrl + "】";
console.log("系统错误 【url: " + showOpt.postUrl + "】" + info);
$.FORM.show_sys_err(dialog, XMLHttpRequest);
}
});
} else {
showD(showOpt, {});
} }, showDialog : function(showOpt, buttons, data) {
showOpt.buttons = $.extend(showOpt.buttons, buttons);
showOpt.data = $.extend({}, showOpt.data, data); if (showOpt.buttons == undefined || showOpt.buttons == null) {
showOpt.buttons = [ {
icon : 'glyphicon glyphicon-ok',
label : '确定',
cssClass : 'btn-primary',
action : function(dialogItself) {
dialogItself.close();
}
} ];
} var cont = $('<div>加载数据中,请稍后...</div>');
var opt = $
.extend(
{
title : showOpt.title,
message : function(dialog) {
return cont;
},
onshown : function(dialogRef) {
var contTmp = $('<div></div>'); var response = '';
if (showOpt.templateUrl) {
$
.ajax({
url : showOpt.templateUrl,
async : false,
success : function(res) {
try {
var t = eval("(" + res
+ ")");
if (t != null
&& t.stat == 0) {
$.FORM
.show_code_err(
null,
t);
if (t.code == 1403) {
cont
.html("<div>您可能已经离线,请重新刷新网页后再试!</div>");
}
dialog
.enableButtons(false);
return; } else {
response = res;
}
} catch (e) {
response = res;
} }
});
} else if (showOpt.template) {
response = "<div>" + showOpt.template
+ "</div>";
} else {
response = "<div></div>";
} if (showOpt.data != undefined) {
// 只要有数据,就用 artTemplate
// 渲染
if (showOpt.templateOption != undefined) {
if (showOpt.templateOption.helpers) {
for ( var i in showOpt.templateOption.helpers) {
var help = showOpt.templateOption.helpers[i];
if (help) {
template.helper(help.name,
help.action);
}
}
}
} var tempRes = template.compile(response);
var dt = tempRes(showOpt.data);
cont.html(dt); if (showOpt.isReadOnly != undefined
&& showOpt.isReadOnly != null
&& !showOpt.isReadOnly) {
// 编辑模式可以再用js2form填充form数据
var rootNode = cont
.find(showOpt.formId)[0];
if (rootNode && rootNode != null)
js2form(rootNode, showOpt.data);
else
js2form(cont[0], showOpt.data);
}
} else {
cont.html(contTmp[0]);
} // form 設置
var formOpt = $(showOpt.formId).getFormOpt();
if (showOpt.isReadOnly != undefined
&& showOpt.isReadOnly != null) { if (showOpt.isReadOnly) {
if (formOpt.onReadonlyMode != undefined)
formOpt
.onReadonlyMode(showOpt.data);
} else {
if (formOpt.onModifyMode != undefined)
formOpt.onModifyMode(showOpt.data);
}
} else {
if (formOpt.onCreateMode != undefined)
formOpt.onCreateMode(showOpt.data);
} if (formOpt.buttons != undefined) {
dialogRef.setButtons(formOpt.buttons);
}
},
draggable : true,
closeByBackdrop : false,
closeByKeyboard : true,
buttons : showOpt.buttons
}, showOpt.dialogOption); var dialog = BootstrapDialog.show(opt);
return dialog;
},
postForm : function(showOpt, dialog) {
dialog.setClosable(false);
dialog.enableButtons(false); var formOpt = $(showOpt.formId).getFormOpt(); var postform = $(showOpt.formId);
var validator = postform.validate(); if (formOpt.preValidDataHandler != undefined) {
if (formOpt.preValidDataHandler(dialog, validator) != true) {
dialog.setClosable(true);
dialog.enableButtons(true);
return;
}
} // validator.form();
if (!postform.valid()) {
postform.focus();
$.FORM.show_stack_err_context(dialog.getModalContent(), false, {
title : "提示",
text : "该页面还有" + validator.numberOfInvalids() + "个字段包含错误!",
type : "notice",
delay : 1500,
hide : true
});
dialog.setClosable(true);
dialog.enableButtons(true);
return;
} if (formOpt.preSloveDataHandler != undefined) {
if (formOpt.preSloveDataHandler(dialog) != true) {
dialog.setClosable(true);
dialog.enableButtons(true);
return;
}
} var formData; if (showOpt.postType) {
switch (showOpt.postType) {
case "multipart":
formData = new FormData(postform[0]);
break;
case "form":
formData = $.param(form2js(postform[0], '.', true,
formOpt.formNodeCallback));
break;
case "json":
formData = JSON.stringify(form2js(postform[0], '.', true,
formOpt.formNodeCallback));
break;
default:
return;
}
} else {
formData = form2js(postform[0], '.', true, formOpt.formNodeCallback);
} if (formOpt.prePostDataHandler != undefined) {
if (formOpt.prePostDataHandler(dialog, formData) != true) {
dialog.setClosable(true);
dialog.enableButtons(true);
return;
}
} if (showOpt.isDebug != undefined && showOpt.isDebug) {
var postdata = JSON.stringify(formData);
alert(postdata);
dialog.setClosable(true);
dialog.enableButtons(true);
return;
} var sendOpt = {
type : "post",
async : false,
url : showOpt.postUrl,
data : formData,
dataType : "json",
success : function(json) {
if (json.stat == 1) {
dialog.close();
new PNotify({
title : '修改成功!',
text : '信息修改成功。',
type : 'success',
animation : "fade",
shadow : true,
hide : true,
delay : 2000,
mobile : {
swipe_dismiss : true,
styling : true
} });
if (showOpt.onPostSuccess != undefined)
showOpt.onPostSuccess(json.data)
} else {
if (json.code != undefined) {
$.FORM.show_code_err(dialog, json);
} else {
$.FORM.show_sys_err(dialog);
}
} dialog.setClosable(true);
dialog.enableButtons(true);
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
var info = "XMLHttpRequest:" + JSON.stringify(XMLHttpRequest)
+ " ;textStatus:" + textStatus + "; errorThrown:"
+ JSON.stringify(errorThrown) + "; 【" + showOpt.postUrl
+ "】";
console.log("系统错误 【url: " + showOpt.postUrl + "】" + info);
$.FORM.show_sys_err(dialog, XMLHttpRequest);
dialog.setClosable(true);
dialog.enableButtons(true);
}
}; if (showOpt.postType) {
switch (showOpt.postType) {
case "multipart":
sendOpt.async = false;
sendOpt.cache = false;
sendOpt.contentType = false;
sendOpt.processData = false;
break;
case "form":
sendOpt.contentType = 'application/x-www-form-urlencoded';
break;
case "json":
sendOpt.contentType = 'application/json';
break;
default:
return;
}
} $.ajax(sendOpt); },
show_sys_err : function(dialog, XMLHttpRequest) {
var opt = {
title : "系统错误",
text : "请您联系管理员!",
type : "error"
};
if (dialog == undefined || dialog == null) {
new PNotify(opt);
} else {
$.FORM.show_stack_err_context(dialog.getModalContent(), false, opt);
} },
show_code_err : function(dialog, json) {
var opt;
if (json.code != undefined && json.code == 1403) {
$.NOTIFY.showLogin();
return;
} else if (json.errorMessages != undefined
&& json.errorMessages != null && json.errorMessages.length > 0) {
opt = {
title : "错误",
text : json.errorMessages[0],
type : "notice",
delay : 1500,
hide : true
};
} if (dialog == undefined || dialog == null) {
new PNotify(opt);
} else {
$.FORM.show_stack_err_context(dialog.getModalContent(), false, opt)
} },
show_stack_err_context : function(context, modal, opt) {
var opts = !opt ? {} : opt;
opts.stack = modal ? {
"push" : "top",
"dir1" : "down",
"dir2" : "left",
"context" : context,
"modal" : true,
"overlay_close" : true
} : {
"push" : "top",
"dir1" : "down",
"dir2" : "left",
"context" : context
};
opts.addclass = "stack-modal";
new PNotify(opts);
}
}
用于辅助在 bootstrap-dialog 中的表现:app-jquery-dialog.js的更多相关文章
- 在Bootstrap开发框架中使用Grid++报表
之前在随笔<在Winform开发中使用Grid++报表>介绍了在Winform环境中使用Grid++报表控件,本篇随笔介绍在Bootstrap开发框架中使用Grid++报表,也就是Web环 ...
- Dialog中更新Activity的数据显示
假设有一个activity,activity中有一个Button和一个TextView,点击按钮,弹出Dialog,对话框中有一个ListView,选中ListView中的某一项,关闭对话框,更新ac ...
- bootstrap -- meta中的viewport指令
在查看bootstrap教程中,碰到 <meta name="viewport" content="width=device-width, initial-scal ...
- 《MFC dialog中加入OpenGL窗体》
<MFC dialog中加入OpenGL窗体> 最近学习了如何在MFC对话框程序中加入OpenGL窗体的方法,在这里将自己的实现过程归纳一下. 步骤零: 加入PictureControl控 ...
- vue+el-element中根据文件名动态创建dialog的方法
背景 在项目中使用对话框的通常做法是把对话框封装成组件,在使用的地方引入,然后添加到template,使用visible.sync控制对话框的显示/隐藏,监听confirm事件处理用户点击确定.如下: ...
- Easyui dialog中嵌入iframe
如果easyui dialog的地址属性用href超链接,easyui 不会加载整个url页面,只会截取url目标页的body体间的html, 如果想加载把其他页面 加载进dialog的iframe中 ...
- bootstrap Table 中给某一特定值设置table选中
bootstrap Table 中给某一特定值设置table选中 需求: 如图所示:左边地图人员选定,右边表格相应选中. 功能代码: //表格和图标联动 function changeTableSel ...
- Bootstrap.css 中请求googleapis.com/css?family 备忘录
问题描述: Web中引入bootstrap.css中头部有访问Google服务器的请求 @import url("//fonts.googleapis.com/css?family=Open ...
- 解决Select2控件不能在jQuery UI Dialog中不能搜索的bug
本文使用博客园Markdown编辑器进行编辑 1.问题呈现 项目中使用了jQuery UI的Dialog控件,一般用来处理需要提示用户输入或操作的简单页面.逻辑是修改一个广告的图片和标题. 效果截图如 ...
随机推荐
- opencv----人脸美白算法,祛斑,祛痘,磨皮等
现在各种手机camera软件都自带图像美颜处理,但是成熟的算法在网上很难搜到,博主也是自己摸索了自己做出来了,跟美图秀秀的处理效果相比,还不错,感觉很好,所以PO上来,与各位博友分享之. 首先是根据网 ...
- 关于Arduino 步进电机Stepper库的一些想法
官方提供了一些库,使Arduino入门起来更加快速,我们连原理都不用懂,就能通过函数控制终端.但是,这样也带来了很多的缺陷,比如,库函数的功能有限,有些无法实现.然后还有库函数因为要考虑其他的情况,你 ...
- 下拉刷新和上拉加载 Swift
转载自:http://iyiming.me/blog/2015/07/05/custom-refresh-and-loading/ 关于下拉刷新和上拉加载,项目中一直使用MJRefresh(原先还用过 ...
- python smtplib.SMTPDataError: (554
- HttpURLConnection请求网络数据的GET请求
//清单文件中添加权限 <uses-permission android:name="android.permission.INTERNET"/> new Thread ...
- GameUnity 2.0 文档(四) 网格+四叉树 最优碰撞检测
在写之前,必须对 前一篇文档补充一下. Camera2DAngle类是 摄像机旋转 2d人物360度,PlayerMove是人物移动. 这两个类 都可以 360 ° 场景旋转人物也跟着旋转. 但不能 ...
- PAT1064(上)分析部分
Complete Binary Search Tree (30) 时间限制 100 ms 内存限制 65536 kB 代码长度限制 16000 B A Binary Search Tree (BST) ...
- discuz!迁移指南
转自:http://jingyan.baidu.com/article/f7ff0bfc77114b2e26bb1390.html 曾经在本地搭建过一个discuz!论坛,现在买了域名和服务器,那么怎 ...
- 求余区间的求和类问题 离线+线段树 HDU4228
题目大意:给一个数组a,他的顺序是严格的单调增,然后有如下三个操作 ①加入一个val到a数组里面去,加入的位置就是a[i-1]<val<a[i+1] ②删除一个a[i]=val的值 ③查询 ...
- zf-关于改绍兴县2个简单的BUG却需要ORACLE数据库的感慨
装了一天你的数据库,其实可以直接检出拿到后台代码,然后远程实施让他进项目,我在他的项目上找action,找图片都是一样的,有时候需求文档上也是会截图到action的,蛋疼,这么简单的方法我居然忘记了.