您的位置:首页 > 其它

windowControl创建弹出窗口($.createWin)

2015-07-22 14:48 411 查看
/**
* @author GodSon
* http://www.btboys.com * date 2011-5-12 12:30 version 2.1
* @How to use
* var path = 'page/newFile.html';
*    var confing = {
*        url : path,
*        title : "标题",
*        width : 500,
*        height : 150,
*        maximizable : false,
*        buttons : [{
*                text : '继续>>',
*                handler : function() {
*                    fun(GETWIN(this));
*                }
*        }]
*    };
*    var curDialogId = $.createWin(confing);
*    销毁
*  $(GETWIN(curDialogId)).destroy();
*/

/**
* @param {Object} options
* return windowId
*/
(function($){
/**
* 创建UUID
*/
function S4() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
/**
* 生成windowId
*/
function  CreateIndentityWindowId(){
return "UUID-"+(S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
/**
* 销毁
*/
function destroy(target){
var options = $(target).dialog("options");
if(options.fck){
$("body").children("iframe").remove();
KE.remove(options.fck.id);
}
if(options.ke){
KE.remove(options.ke.id);
}
$(target).dialog("destroy");
}

/**
* 获取当前操作的window
*  @param target 当前窗口的windowId 或者 当前窗口中的元素(element)
*/
function getWindow(target){
if(typeof target == "string"){
return document.getElementById(target);
}else{
return $(target).parents(".window-body");
}
}

//入口方法
$.createWin = function(options){
if(!options.url && !options.content){
$.messager.alert("提示","缺少必要参数!(url or content)");
return false;
}

var windowId = CreateIndentityWindowId();

if(options.winId){
windowId=options.winId;
}

//如果存在buttons(请看easyui对buttons的定义),默认添加关闭按钮
if(options.buttons){
var closeBtn = {
text:'关闭',
handler:function(){
$("#"+windowId).dialog("destroy");
}
};
options.buttons.push(closeBtn);
}

options = $.extend({},$.createWin.defaults, options || {});

if(options.content){
ajaxSuccess(options.content);
}else{
if(!options.isIframe){
$.ajax({
url:options.url,
type:"POST",
data:options.data == null ? "" : options.data,
success:function(date){
ajaxSuccess(date);
},
error:function(){
$.messager.alert("提示","加载失败!");
}
});
}else{
ajaxSuccess();
}
}
return windowId;

/**
* 页面加载成功处理
*/
function ajaxSuccess(date){
var dialog  = $('<div id="'+windowId+'"></div>');
if(options.target == 'body'){
dialog.appendTo(options.target);
}else{
options.inline = true;
dialog.appendTo($(options.target));
}
if(options.isIframe && !date){
$(dialog).html('<iframe width="100%" height="100%" frameborder="0" src="'+options.url+'" ></iframe>');
}else{
$(dialog).html(date);
}

dialog.dialog(options);
dialog.dialog('open');

options.onComplete.call(this,windowId);                                    //创建成功后回调函数
//可以整合fck的显示
// options.fck:{
//         "id":textAreaIdORtextAreaName,
//      "height":fckHeight
// }
if(options.fck){
CKEDITOR.replace(options.fck.id,{
height:options.fck.height
});
}
//可以整合KindEditor的显示
// options.ke:{
//         "id":textAreaId
// }
if(options.ke){
KE.init(options.ke);
KE.create(options.ke.id);
}
}
};

//关闭并销毁实体
$.fn.destroy =function(){
destroy(this);
};

window.GETWIN = getWindow;

//默认参数
$.createWin.defaults = $.extend({},$.fn.dialog.defaults,{
url:'',                    //窗口要加载的html片段地址
data:'',                //可带参数,data类型为jqurey.ajax的data参数类型
target:'body',                //指定窗口打开的区域,是一个jq的选择器,例如#id
isIframe:false,            //如果存在url,是否在iframe里面打开url
zIndex: 100000,
height : 200,
width : 400,
collapsible: false,
minimizable: false,
maximizable: false,
closable: true,
modal:true,
onClose:function(){
destroy(this);
},
onMove:function(left,top){
var opts = $.data(this, 'panel').options;
if(top < 0){
$(this).dialog("move",{"left":left,"top":0});
}else if(opts.maximized){
$(this).dialog("restore");
$(this).dialog("move",{"left":left+100,"top":top});
}
if(top > ($(opts.target).height()-20)){
$(this).dialog("move",{"left":left,"top":($(opts.target).height()-25)});
}
},
onComplete:function(windowId){}    //创建成功后的回调方法
});
})(jQuery);
弹出框实例:
top.jQuery.createWin({
title:"弹出框",
url:'list.do',
height:530,
width:1000,
shadow:true,
isIframe:true, //url,使用iframe,方便弹出框列表的分页
winId:'suspect_id',
buttons:[{
text:'保存',
handler:function(){
// 显示进度条
top.$.messager.progress({
text:'数据加载中,请稍后……'
});
//隐藏滚动条
top.$.messager.progress('close');
//top.$("#listid").closest('.window-body').dialog('destroy');  							                                  top.$("#suspect_id").dialog('destroy');<span style="white-space:pre">		</span>
}
}]
});
弹出框dialog:
top.$('#easyuiDialog').dialog({
title: '请选择',
width:top.$('#home').width()*0.9,
height:top.$('#home').height()*0.9,
closed: false,
cache: false,
href: 'list.do',
modal: true
});
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: