用于辅助在 bootstrap-dialog 中的表现:app-jquery-dialog.js
1 // 用于通某个元素共享配置数据
2 $.extend($.fn, {
3 formOption : function(showOpt) {
4 var opt = $.data(this[0], "formOpt");
5
6 var settings;
7 if (opt) {
8 settings = $.extend({}, opt, showOpt);
9 } else {
10 settings = showOpt;
11 }
12
13 $.data(this[0], "formOpt", settings);
14 },
15 getFormOpt : function() {
16 if (this[0] != undefined) {
17 var opt = $.data(this[0], "formOpt");
18 if (opt != undefined && opt != null)
19 return opt;
20 }
21 return {};
22 }
23 })
24
25 $.FORM = {
26 showConfirm : function(showOpt) {
27 var opt = {
28 title : showOpt.title,
29 message : showOpt.message,
30 draggable : true,
31 closeByBackdrop : false,
32 type : BootstrapDialog.TYPE_WARNING,
33 buttons : [
34 {
35 id : "btn-confirm",
36 icon : 'glyphicon glyphicon-saved',
37 label : '确定',
38 cssClass : 'btn-warning',
39 action : function(dialogItself) {
40 if (showOpt.url != undefined) {
41 $.HTTP
42 .obj({
43 type : showOpt.ajaxType == undefined ? 'post'
44 : showOpt.ajaxType,
45 url : showOpt.url,
46 ajaxData : showOpt.ajaxData,
47 success : function(json) {
48 if (showOpt.autoClose) {
49 dialogItself.close();
50 $.NOTIFY
51 .showSuccess(
52 showOpt.successTitle,
53 showOpt.successMessage);
54 } else {
55 dialogItself
56 .setTitle(showOpt.successTitle);
57 dialogItself
58 .setMessage(showOpt.successMessage);
59 dialogItself
60 .setType(BootstrapDialog.TYPE_SUCCESS);
61 dialogItself
62 .setButtons([ {
63 icon : 'glyphicon glyphicon-saved',
64 label : '确定',
65 cssClass : 'btn-success',
66 action : function(
67 d) {
68 d.close();
69 }
70 } ]);
71 }
72
73 if (showOpt.onSuccess)
74 showOpt.onSuccess(json);
75 }
76 })
77 } else {
78 if (showOpt.onConfirm(dialogItself)) {
79 dialogItself.close();
80 }
81 }
82
83 }
84 }, {
85 icon : 'glyphicon glyphicon-ban-circle',
86 label : '取消',
87 action : function(dialogItself) {
88 dialogItself.close();
89 }
90 } ]
91 };
92
93 var dialog = BootstrapDialog.show(opt);
94 return dialog;
95 },
96 /**
97 * title,isReadOnly,postUrl,data,dataSource,fields,properties,dependencies ,
98 * formNodeCallback 收集表单信息回调
99 */
100 showFormDialog : function(showOpt) {
101
102 var dialog;
103 var buttons;
104 var showD = function(showOpt, data) {
105 if (showOpt.isReadOnly != undefined && showOpt.isReadOnly != null) {
106 if (showOpt.isReadOnly) {
107 // 只读模式
108 } else {
109 // 修改模式
110 buttons = [ {
111 icon : 'glyphicon glyphicon-saved',
112 label : '修改',
113 cssClass : 'btn-primary',
114 action : function(dialogItself) {
115 $.FORM.postForm(showOpt, dialogItself);
116 }
117 }, {
118 icon : 'glyphicon glyphicon-ban-circle',
119 label : '取消',
120 action : function(dialogItself) {
121 dialogItself.close();
122 }
123 } ];
124 }
125 } else {
126 // 添加模式
127 buttons = [ {
128 icon : 'glyphicon glyphicon-saved',
129 label : '保存',
130 cssClass : 'btn-primary',
131 action : function(dialogItself) {
132 $.FORM.postForm(showOpt, dialogItself);
133 }
134 }, {
135 icon : 'glyphicon glyphicon-ban-circle',
136 label : '取消',
137 action : function(dialogItself) {
138 dialogItself.close();
139 }
140 } ];
141 }
142
143 dialog = $.FORM.showDialog(showOpt, buttons, data);
144
145 }
146
147 // 如果有数据先加载数据
148 if (showOpt.dataSource != undefined && showOpt.dataSource != null) {
149 $.ajax({
150 type : "get",
151 async : false,
152 url : showOpt.dataSource,
153 contentType : 'application/json',
154 dataType : "json",
155 success : function(json) {
156 if (json.stat == 1) {
157 showD(showOpt, json.data);
158 } else {
159 if (json.code != undefined) {
160 $.FORM.show_code_err(dialog, json);
161 } else {
162 $.FORM.show_sys_err(dialog);
163 return;
164 }
165 }
166 },
167 error : function(XMLHttpRequest, textStatus, errorThrown) {
168 var info = "XMLHttpRequest:"
169 + JSON.stringify(XMLHttpRequest) + " ;textStatus:"
170 + textStatus + "; errorThrown:"
171 + JSON.stringify(errorThrown) + "; 【"
172 + showOpt.postUrl + "】";
173 console.log("系统错误 【url: " + showOpt.postUrl + "】" + info);
174 $.FORM.show_sys_err(dialog, XMLHttpRequest);
175 }
176 });
177 } else {
178 showD(showOpt, {});
179 }
180
181 },
182
183 showDialog : function(showOpt, buttons, data) {
184 showOpt.buttons = $.extend(showOpt.buttons, buttons);
185 showOpt.data = $.extend({}, showOpt.data, data);
186
187 if (showOpt.buttons == undefined || showOpt.buttons == null) {
188 showOpt.buttons = [ {
189 icon : 'glyphicon glyphicon-ok',
190 label : '确定',
191 cssClass : 'btn-primary',
192 action : function(dialogItself) {
193 dialogItself.close();
194 }
195 } ];
196 }
197
198 var cont = $('<div>加载数据中,请稍后...</div>');
199 var opt = $
200 .extend(
201 {
202 title : showOpt.title,
203 message : function(dialog) {
204 return cont;
205 },
206 onshown : function(dialogRef) {
207 var contTmp = $('<div></div>');
208
209 var response = '';
210 if (showOpt.templateUrl) {
211 $
212 .ajax({
213 url : showOpt.templateUrl,
214 async : false,
215 success : function(res) {
216 try {
217 var t = eval("(" + res
218 + ")");
219 if (t != null
220 && t.stat == 0) {
221 $.FORM
222 .show_code_err(
223 null,
224 t);
225 if (t.code == 1403) {
226 cont
227 .html("<div>您可能已经离线,请重新刷新网页后再试!</div>");
228 }
229 dialog
230 .enableButtons(false);
231 return;
232
233 } else {
234 response = res;
235 }
236 } catch (e) {
237 response = res;
238 }
239
240 }
241 });
242 } else if (showOpt.template) {
243 response = "<div>" + showOpt.template
244 + "</div>";
245 } else {
246 response = "<div></div>";
247 }
248
249 if (showOpt.data != undefined) {
250 // 只要有数据,就用 artTemplate
251 // 渲染
252 if (showOpt.templateOption != undefined) {
253 if (showOpt.templateOption.helpers) {
254 for ( var i in showOpt.templateOption.helpers) {
255 var help = showOpt.templateOption.helpers[i];
256 if (help) {
257 template.helper(help.name,
258 help.action);
259 }
260 }
261 }
262 }
263
264 var tempRes = template.compile(response);
265 var dt = tempRes(showOpt.data);
266 cont.html(dt);
267
268 if (showOpt.isReadOnly != undefined
269 && showOpt.isReadOnly != null
270 && !showOpt.isReadOnly) {
271 // 编辑模式可以再用js2form填充form数据
272 var rootNode = cont
273 .find(showOpt.formId)[0];
274 if (rootNode && rootNode != null)
275 js2form(rootNode, showOpt.data);
276 else
277 js2form(cont[0], showOpt.data);
278 }
279 } else {
280 cont.html(contTmp[0]);
281 }
282
283 // form 設置
284 var formOpt = $(showOpt.formId).getFormOpt();
285 if (showOpt.isReadOnly != undefined
286 && showOpt.isReadOnly != null) {
287
288 if (showOpt.isReadOnly) {
289 if (formOpt.onReadonlyMode != undefined)
290 formOpt
291 .onReadonlyMode(showOpt.data);
292 } else {
293 if (formOpt.onModifyMode != undefined)
294 formOpt.onModifyMode(showOpt.data);
295 }
296 } else {
297 if (formOpt.onCreateMode != undefined)
298 formOpt.onCreateMode(showOpt.data);
299 }
300
301 if (formOpt.buttons != undefined) {
302 dialogRef.setButtons(formOpt.buttons);
303 }
304 },
305 draggable : true,
306 closeByBackdrop : false,
307 closeByKeyboard : true,
308 buttons : showOpt.buttons
309 }, showOpt.dialogOption);
310
311 var dialog = BootstrapDialog.show(opt);
312 return dialog;
313 },
314 postForm : function(showOpt, dialog) {
315 dialog.setClosable(false);
316 dialog.enableButtons(false);
317
318 var formOpt = $(showOpt.formId).getFormOpt();
319
320 var postform = $(showOpt.formId);
321 var validator = postform.validate();
322
323 if (formOpt.preValidDataHandler != undefined) {
324 if (formOpt.preValidDataHandler(dialog, validator) != true) {
325 dialog.setClosable(true);
326 dialog.enableButtons(true);
327 return;
328 }
329 }
330
331 // validator.form();
332 if (!postform.valid()) {
333 postform.focus();
334 $.FORM.show_stack_err_context(dialog.getModalContent(), false, {
335 title : "提示",
336 text : "该页面还有" + validator.numberOfInvalids() + "个字段包含错误!",
337 type : "notice",
338 delay : 1500,
339 hide : true
340 });
341 dialog.setClosable(true);
342 dialog.enableButtons(true);
343 return;
344 }
345
346 if (formOpt.preSloveDataHandler != undefined) {
347 if (formOpt.preSloveDataHandler(dialog) != true) {
348 dialog.setClosable(true);
349 dialog.enableButtons(true);
350 return;
351 }
352 }
353
354 var formData;
355
356 if (showOpt.postType) {
357 switch (showOpt.postType) {
358 case "multipart":
359 formData = new FormData(postform[0]);
360 break;
361 case "form":
362 formData = $.param(form2js(postform[0], '.', true,
363 formOpt.formNodeCallback));
364 break;
365 case "json":
366 formData = JSON.stringify(form2js(postform[0], '.', true,
367 formOpt.formNodeCallback));
368 break;
369 default:
370 return;
371 }
372 } else {
373 formData = form2js(postform[0], '.', true, formOpt.formNodeCallback);
374 }
375
376 if (formOpt.prePostDataHandler != undefined) {
377 if (formOpt.prePostDataHandler(dialog, formData) != true) {
378 dialog.setClosable(true);
379 dialog.enableButtons(true);
380 return;
381 }
382 }
383
384 if (showOpt.isDebug != undefined && showOpt.isDebug) {
385 var postdata = JSON.stringify(formData);
386 alert(postdata);
387 dialog.setClosable(true);
388 dialog.enableButtons(true);
389 return;
390 }
391
392 var sendOpt = {
393 type : "post",
394 async : false,
395 url : showOpt.postUrl,
396 data : formData,
397 dataType : "json",
398 success : function(json) {
399 if (json.stat == 1) {
400 dialog.close();
401 new PNotify({
402 title : '修改成功!',
403 text : '信息修改成功。',
404 type : 'success',
405 animation : "fade",
406 shadow : true,
407 hide : true,
408 delay : 2000,
409 mobile : {
410 swipe_dismiss : true,
411 styling : true
412 }
413
414 });
415 if (showOpt.onPostSuccess != undefined)
416 showOpt.onPostSuccess(json.data)
417 } else {
418 if (json.code != undefined) {
419 $.FORM.show_code_err(dialog, json);
420 } else {
421 $.FORM.show_sys_err(dialog);
422 }
423 }
424
425 dialog.setClosable(true);
426 dialog.enableButtons(true);
427 },
428 error : function(XMLHttpRequest, textStatus, errorThrown) {
429 var info = "XMLHttpRequest:" + JSON.stringify(XMLHttpRequest)
430 + " ;textStatus:" + textStatus + "; errorThrown:"
431 + JSON.stringify(errorThrown) + "; 【" + showOpt.postUrl
432 + "】";
433 console.log("系统错误 【url: " + showOpt.postUrl + "】" + info);
434 $.FORM.show_sys_err(dialog, XMLHttpRequest);
435 dialog.setClosable(true);
436 dialog.enableButtons(true);
437 }
438 };
439
440 if (showOpt.postType) {
441 switch (showOpt.postType) {
442 case "multipart":
443 sendOpt.async = false;
444 sendOpt.cache = false;
445 sendOpt.contentType = false;
446 sendOpt.processData = false;
447 break;
448 case "form":
449 sendOpt.contentType = 'application/x-www-form-urlencoded';
450 break;
451 case "json":
452 sendOpt.contentType = 'application/json';
453 break;
454 default:
455 return;
456 }
457 }
458
459 $.ajax(sendOpt);
460
461 },
462 show_sys_err : function(dialog, XMLHttpRequest) {
463 var opt = {
464 title : "系统错误",
465 text : "请您联系管理员!",
466 type : "error"
467 };
468 if (dialog == undefined || dialog == null) {
469 new PNotify(opt);
470 } else {
471 $.FORM.show_stack_err_context(dialog.getModalContent(), false, opt);
472 }
473
474 },
475 show_code_err : function(dialog, json) {
476 var opt;
477 if (json.code != undefined && json.code == 1403) {
478 $.NOTIFY.showLogin();
479 return;
480 } else if (json.errorMessages != undefined
481 && json.errorMessages != null && json.errorMessages.length > 0) {
482 opt = {
483 title : "错误",
484 text : json.errorMessages[0],
485 type : "notice",
486 delay : 1500,
487 hide : true
488 };
489 }
490
491 if (dialog == undefined || dialog == null) {
492 new PNotify(opt);
493 } else {
494 $.FORM.show_stack_err_context(dialog.getModalContent(), false, opt)
495 }
496
497 },
498 show_stack_err_context : function(context, modal, opt) {
499 var opts = !opt ? {} : opt;
500 opts.stack = modal ? {
501 "push" : "top",
502 "dir1" : "down",
503 "dir2" : "left",
504 "context" : context,
505 "modal" : true,
506 "overlay_close" : true
507 } : {
508 "push" : "top",
509 "dir1" : "down",
510 "dir2" : "left",
511 "context" : context
512 };
513 opts.addclass = "stack-modal";
514 new PNotify(opts);
515 }
516 }