1. 程式人生 > >基於easyui的彈出視窗,自己留個以後用

基於easyui的彈出視窗,自己留個以後用

/**
 * @deprecated 彈出視窗元件,基於easyui-1.3.2+,
 * @author caonq
 * @version 0.1
 */
var popWin={
 setupNum:1,
 buttons:[],
 //初始化元件。
 init:function(){
   if(parent.$("#_pop_winParent").length>0){
    parent.$("#_pop_winParent").remove();
   }
   $('<div id="_pop_winParent"><div id="_pop_win"></div></div>').appendTo(window.top.document.body);
 },
 //初始化訊息列表元件
 initMsgList:function(){
  if($("#_pop_winParent").length>0){
   $("#_pop_winParent").remove();
  }
  $('<div id="_pop_winParent"><div id="showMsgList"><div id="msgDetail"></div></div></div>').appendTo("body");
 },
 /**
  * 多條提示資訊以列表的方式顯示
  * @param msg 已格式化的提示資訊
  * @param width 寬度 預設600
  * @param height 高度 預設300
  */
 popMsgList:function(msg,width,height){
  popWin.initMsgList();
  $("#msgDetail").append(msg);
  $("#showMsgList").dialog({
   closed:true,
   closable:false,
   title:"提示訊息",
   resizable:true,
   maximizable:false,
   modal:true,
   width:width==undefined?'600':width,
   height:height==undefined?'300':height,
   buttons: [{
     text:'關閉',
     handler:function(){
       $("#showMsgList").dialog("destroy").remove();  
       }
      }]
   });
   $("#showMsgList").dialog("open");
 },
 init_1:function(){
  if(parent.$("#_pop_winParent_1").length>0){
   parent.$("#_pop_winParent_1").remove();
  }
  $('<div id="_pop_winParent_1"><div id="_pop_win_1"></div></div>').appendTo(window.top.document.body);
 },
 //開啟明細畫面。只有關閉按鈕
 popView:function(url,title,width,height){
  popWin.init();
  var content = '<iframe id="_dialogFrame" name="_dialogFrame" src="' + url + '" width="100%" height="99%" frameborder="0" scrolling="auto"></iframe>';
   parent.$("#_pop_win").dialog({
   closed:true,
   closable:false,
   title:" ",
   content: content,
   resizable:true,
   maximizable:true,
   modal:true,
   width:width==undefined?'800':width,
   height:height==undefined?'600':height,
   buttons: [{
      text:'關閉',
   iconCls:'icon-cancel',
   handler:function(){
     popWin.close();
       }
      }]
   });
   parent.$("#_pop_win").dialog("open");
 },
 //開啟明細畫面,被開啟的頁面js有效,有提交和關閉按鈕
 popEdit:function(url,title,width,height){
  popWin.init();
   var content = '<iframe id="_dialogFrame" name="_dialogFrame" src="' + url + '" width="100%" height="99%" frameborder="0" scrolling="auto"></iframe>';
   parent.$("#_pop_win").dialog({
    closed:true,
    closable:false,
    title:" ",
    content: content,
    maximizable:true,
    resizable:true,
    modal:true,
    width:width==undefined?'800':width,
    height:height==undefined?'600':height,
    buttons: [{
       text:'提交',
       id:'save-button',
       iconCls:'icon-save',
       handler:function(){
        popWin.submit();
       }
      },{
       text:'關閉',
       iconCls:'icon-cancel',
       id:'close-button',
       handler:function(){
        popWin.close();
       }
      }]
   });
  parent.$("#_pop_win").dialog("open");
 },
 //有下一步的彈出視窗
 popNext:function(url,title,steps,width,height){
  popWin.init();
  if(steps==undefined||steps==1){
   popWin.popEdit(url,title,width,height);
  }else{
   if(popWin.setupNum<steps){
    var content = '<iframe id="_dialogFrame" name="_dialogFrame" src="' + url + '" width="100%" height="99%" frameborder="0" scrolling="auto"></iframe>';
   parent.$("#_pop_win").dialog({
    closed:true,
    closable:false,
    title:" ",
    content: content,
    maximizable:true,
    resizable:true,
    modal:true,
    width:width==undefined?'800':width,
    height:height==undefined?'600':height,
    buttons: [{
       text:'上一步',
       id:'back-button',
       iconCls:'icon-back',
       handler:function(){
        popWin.backSubmit();
       }
      },
              {
       text:'跳過',
       id:'skip-button',
       iconCls:'icon-ok',
       handler:function(){
        popWin.skipSubmit();
       }
      },
              {
       text:'下一步',
       id:'save-button',
       iconCls:'icon-ok',
       handler:function(){
        if(popWin.setupNum!=steps){
         popWin.nextSubmit(steps);
        }else{
         popWin.submit();
        }
       }
      },{
       text:'取消',
       iconCls:'icon-cancel',
       id:'close-button',
       handler:function(){
        popWin.close();
       }
      }]
   });
  parent.$("#skip-button").hide();
  parent.$("#back-button").hide();
  parent.$("#_pop_win").dialog("open");
   }
  }

 },
 //內部呼叫,外部不需呼叫
 data:function(){
  var win = window.parent.document.getElementById('_dialogFrame').contentWindow; 
     var winHtml=win.document.body;
     var form=$(winHtml).find(".popWin");
     if(form.size()>0){
      var action=form.attr("action");
      var submitCheck=form.attr("submitCheck");
      var check;
      if(submitCheck==""||submitCheck==undefined){
       check=true;
       }else{
        check=eval("parent.$(\"#_dialogFrame\")[0].contentWindow."+submitCheck);
       }
      if(check){
       return {actionUrl:action,fromData:form.serialize()};
      } 
     }else{
      //$.messager.alert("錯誤資訊","獲取表單資料出錯,請聯絡開發者!","error");
     }
  return null;
 },
 //帶自定義按鈕的dialog
 definedWin:function(url,title,width,height){
  popWin.init();
  var content = '<iframe id="_dialogFrame" name="_dialogFrame" src="' + url + '" width="100%" height="99%" frameborder="0" scrolling="auto"></iframe>';
  parent.$("#_pop_win").dialog({
   closed:true,
   closable:false,
   title:" ",
   content: content,
   maximizable:true,
   resizable:true,
   modal:true,
   width:width==undefined?'800':width,
   height:height==undefined?'600':height,
   buttons:popWin.buttons
  });
  parent.$("#_pop_win").dialog("open");
 },
 /**
  * 描述:
  * 用法:
  * @param url 需要在dialog中開啟的頁面的地址
  * @param title dialog的標題(目前無效,預設為空格)
  * @param width dialog的寬度,不定義的話預設800
  * @param height dialog的高度,不定義的話預設600
  */
 definedWin_1:function(url,title,width,height){
  popWin.init_1();
  var content = '<iframe id="_dialogFrame_1" name="_dialogFrame" src="' + url + '" width="100%" height="99%" frameborder="0" scrolling="auto"></iframe>';
  parent.$("#_pop_win_1").dialog({
   closed:true,
   closable:false,
   title:" ",
   content: content,
   maximizable:true,
   resizable:true,
   modal:true,
   width:width==undefined?'800':width,
   height:height==undefined?'600':height,
   buttons:popWin.buttons
  });
  parent.$("#_pop_win_1").dialog("open");
 },
 /**
  *  描述:執行dialog中的函式
  *  用法:在使用popWin.definedWin,popWin.popView,popWinEdit方法的頁面中使用popWin.runFunc執行dialog中的方法。
  * @param func dialog中的函式
  * @returns
  */
 runFunc:function(func){
  return eval("parent.$(\"#_dialogFrame\")[0].contentWindow."+func);
 },
 /**
  * 描述:呼叫父頁面的函式。
  * 用法:先定義popWin.pFunc,然後使用popWin.runParentfunc呼叫父頁面的函式
  */
 runParentfunc:function(){
  return eval(popWin.pFunc);
 },
 /**
  * 描述:定義需呼叫父頁面的函式
  * 用法:當使用popWin.definedWin,popWin.popView,popWinEdit方法前賦值,可以在開啟的dialog中使用popWin.runParentfunc呼叫父頁面的函式
  */
 pFunc:"",
 /**
  * 在使用popWin.definedWin_1的頁面執行彈出的dialog中頁面的函式。
  * @param func :彈出的dialog中頁面的函式
  * @returns 函式的返回值
  */
 runFunc_1:function(func){
  return eval("parent.parent.$(\"#_dialogFrame_1\")[0].contentWindow."+func);
 },
 /**
  * 描述:關閉dialog。
  * 用法:當呼叫popWin.definedWin,popWin.popView,popWinEdit方法,需要關閉開啟的dialog時使用popWin.close關閉dialog。
  */
 close:function(){
  parent.$("#_pop_win").dialog("destroy").remove();  
  this.setupNum=1;
 },
 /**
  * 描述:關閉dialog。
  * 用法:當呼叫popWin.definedWin_1方法,需要關閉開啟的dialog時使用popWin.close_1關閉dialog。
  */
 close_1:function(){
  parent.$("#_pop_win_1").dialog("destroy").remove();  
  //parent.$("#_pop_winParent_1").append("<div id='_pop_win_1'></div>" );
  this.setupNum=1;
 },
 /**
 *描述:dialog-Toolbar的確認按鈕按鈕的動作,內部呼叫
 *用法:在有確認按鈕的畫面中,需要提交的表單增加form的屬性:class='popWin' submitCheck='form表單提交校驗的方法' action='提交動作的提交地址'
 *(提示:submitCheck的方法為校驗方法,校驗沒過的請return false,校驗過的話return true,不能只用return)'
 */
 submit:function(){
   var returnData=popWin.data();
   if(returnData!=null){
    $.ajax({
     url:returnData.actionUrl,
     data:returnData.fromData,
     async:false,
     type:"POST",
     success:function(data){
      top.$.messager.alert("提示資訊",data.o_msg,"",function(data_){
       if(popWin.pFunc!=""){
        popWin.runParentfunc();
       }
      });
      popWin.close();
     },
     error:function(){
      top.$.messager.alert("錯誤資訊","提交表單出錯,請聯絡開發者!","error");
      popWin.close();
     }
    });
   }
 },
 /**
 *描述:dialog-Toolbar的下一步按鈕按鈕的動作,內部呼叫
 *用法:在有下一步按鈕的畫面中,需要提交的表單增加form的屬性:class='popWin' submitFunc='下一步按鈕的方法' action='下一步動作的提交地址'
 *(提示:submitFunc的方法為正常的form表單提交,校驗沒過的請return false,不要只return)'
 */
 nextSubmit:function (steps){
   ifr=parent.$('#_dialogFrame').contents();
   var form=parent.$(ifr).find(".popWin");
   var func=form.attr("submitFunc");
   subFg=eval("parent.$(\"#_dialogFrame\")[0].contentWindow."+func);
   if(subFg!=false){
    popWin.setupNum = popWin.setupNum+1;
    if(popWin.setupNum==steps){
     parent.$("#save-button").find(".l-btn-text").text("確定");
     parent.$("#save-button").find(".l-btn-icon.icon-next").attr("class","l-btn-icon icon-save");
     parent.$("#close-button").find(".l-btn-text").text("關閉");
     parent.$("#back-button").show();
    }
   }
  },
 /**
 *描述:dialog-Toolbar的上一步按鈕的動作,內部呼叫
 *用法:在有上一步按鈕的畫面中,需要提交的表單增加form的屬性:class='popWin' backFunc='上一步按鈕的方法' action='上一步動作的提交地址'
 *(提示:backFunc的方法為正常的form表單提交,校驗沒過的請return false,不要只return。)'
 */
 backSubmit:function(){
  ifr=parent.$('#_dialogFrame').contents();
  var form=parent.$(ifr).find(".popWin");
  var func=form.attr("backFunc");
  subFg=eval("parent.$(\"#_dialogFrame\")[0].contentWindow."+func);
  if(subFg!=false){
   popWin.setupNum = popWin.setupNum-1;
  }
  parent.$("#save-button").show();
  if(popWin.setupNum > 1){
   parent.$("#back-button").show();
  }else{
   parent.$("#back-button").hide();
  }
  parent.$("#save-button").find(".l-btn-text").text("下一步");
 },
 /**
 *描述:dialog-Toolbar的跳過按鈕的動作,內部呼叫
 *用法:在有跳過按鈕的畫面中,需要提交的表單增加form的屬性:class='popWin' skipFunc='跳過按鈕的方法 action='跳過動作的提交地址'
 *(提示:skipFunc的方法為正常的form表單提交,校驗沒過的請return false,不要只return)'
 */
 skipSubmit:function(){
  ifr=parent.$('#_dialogFrame').contents();
  var form=parent.$(ifr).find(".popWin");
  var func=form.attr("skipFunc");
  subFg=eval("parent.$(\"#_dialogFrame\")[0].contentWindow."+func);
  if(subFg!=false){
   popWin.setupNum = popWin.setupNum+1;
  }
 }
};