<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <%@page contentType="text/html; charset=UTF-8"%> <%@ page import="com.csc.library.entry.*,com.csc.library.system.*,com.csc.library.utilities.*,com.csc.library.session.*,com.csc.library.components.*,com.csc.library.report.*,java.util.*,java.text.DecimalFormat,java.math.BigDecimal,com.csc.library.database.DataSet;"%> <jsp:useBean id="MANPOWER" scope="page" class="com.csc.library.system.Task" /> <html ng-app="myHR"> <% CheckNull chk = new CheckNull(); CscCalendar cs = new CscCalendar(); MANPOWER.setChannel(request ,response); ProcessEntry screen=(ProcessEntry)MANPOWER.process("ProcessEntry","Process"); screen.process(); //initial value String thisdate = cs.getYYYYMMDD(); String language = screen.getUProfile().get("lang"); %> <html ng-app="myHR"> <title>ReportOption</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link href="../CSS/TISCO.css" rel="stylesheet" type="text/css"> <link href="../CSS/bootstrap.css" rel="stylesheet" type="text/css"> <link href="../CSS/bootstrap_csc_backend.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="../JS/jquery-2.1.3.min.js"></script> <script type='text/javascript' src="../JS/bootstrap.js"></script> <link href="../CSS/Bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"> <script src="../JS/jquery-1.11.2.js" type="text/javascript"></script> <script src="../JS/jquery-ui-1.11.4.js" type="text/javascript"></script> <script type='text/javascript' src='../JS/bootstrap.js'></script> <script src="../JS/SCREEN.js"></script> <SCRIPT TYPE='text/JavaScript' SRC='../TA/JS/TA_SCREEN.js'></SCRIPT> <script src="../JS/angular-1.3.15/angular.js" type="text/javascript"></script> <script src="../JS/ANGULAR/SCREEN_ANGULAR.js" type="text/javascript"></script> <!-- <script type='text/JavaScript' SRC='../JS/ANGULAR/SWAPLANG.js'></script> --> <script type='text/javascript' src='../JS/ICONSMENU.js'></script> <script language='javascript'>setLang('<%=screen.getUProfile().get("lang")%>');</script> <script src="../JS/VIEWCALENDAR.js"></script> <script src='../JS/ICONSMENU.js'></script> <script src='../JS/HOTKEY.js'></script> <script src="../JS/DATEINPUT.js"></script> <script src="../JS/CscBase.js"></script> <script src="../JS/CscCalendar.js"></script> <!-- Call DWR --> <script type='text/javascript' src='/hr/dwr/interface/ManpowerBudget.js'></script> <script type='text/javascript' src='/hr/dwr/engine.js'></script> <script type='text/javascript' src='/hr/dwr/util.js'></script> <script>getTitleName();</script> <style> td.result { border: 1px solid black; } td.init{ height: 0px; } </style> <script type="text/JavaScript"> var lang = getLang(); //--> var sw = new swaplang2(); //------- Global value -------- var jsonArray = []; function goHelp(helpName,inputName){ var helpReturn; var fixcon; var thisdate = "<%=cs.getYYYYMMDD()%>"; if(inputName=="__manid" ){ helpReturn="__manid:budid,__tdesc:tdesc,__edesc:edesc,__jobid:jobid,__branchid:branch,__bu1:bu1,__bu2:bu2,__bu3:bu3,__bu4:bu4,__bu5:bu5,__jobid:jobid,__startdate:start_date,__todate:end_date,__condition$budid:budid,__pstatus:status,__pactive:active"; linkHelp_Return_CallFunction(helpName,helpReturn,"getDesc"); }else{ if(inputName=="__bu1" ){ helpReturn="__bu1:bu1id,__bu1_desc:tdesc|desc"; }else if(inputName=="__bu2" ){ helpReturn="__bu2:bu2id,__bu2_desc:tdesc|desc"; }else if(inputName=="__bu3" ){ helpReturn="__bu3:bu3id,__bu3_desc:tdesc|desc"; }else if(inputName=="__bu4" ){ helpReturn="__bu4:bu4id,__bu4_desc:tdesc|desc"; }else if(inputName=="__bu5" ){ helpReturn="__bu5:bu5id,__bu5_desc:tdesc|desc"; }else if(inputName=="__branchid" ){ helpReturn="__branchid:branchid,__branch_desc:tdesc|desc"; }else if(inputName=="__jobid" ){ helpReturn="__jobid:jobcodeid,__job_desc:tdesc|desc"; } linkHelp_Return(helpName,helpReturn); } } function postReturn(){ with(document.cscform){ //Do after post in field } } function getDesc(){ with(document.cscform){ $("input[name=__plan_active][value='"+$("input[name=__pactive]").val()+"']").prop("checked",true); $("input[name=__plan_status][value='"+$("input[name=__pstatus]").val()+"']").prop("checked",true); //Do Something in each id (Disable textbox) var branchid = __branchid.value; var bu1 = __bu1.value; var bu2 = __bu2.value; var bu3 = __bu3.value; var bu4 = __bu4.value; var bu5 = __bu5.value; var jobid = __jobid.value; //Send to Dwr to getDesc ManpowerBudget.getDesc(branchid,bu1,bu2,bu3,bu4,bu5,jobid,AfterGetDesc); //ManpowerBudget.testDWR("AfterGetDesc"); } } function AfterGetDesc(data){ with(document.cscform){ //alert(data); var splitData = data.split(","); if(splitData[0] != 'nodata'){ __branch_desc.value = splitData[0]; } if(splitData[1]!='nodata'){ __bu1_desc.value = splitData[1]; } if(splitData[2]!='nodata'){ __bu2_desc.value = splitData[2]; } if(splitData[3]!='nodata'){ __bu3_desc.value = splitData[3]; } if(splitData[4]!='nodata'){ __bu4_desc.value = splitData[4]; } if(splitData[5]!='nodata'){ __bu5_desc.value = splitData[5]; } if(splitData[6]!='nodata'){ __job_desc.value = splitData[6]; } } } function GoSearch(){ with(document.cscform){ var filterheal=""; //filterheal=checkCondition2(filterheal2,__emp1,__emp2,"employeeid") filterheal=checkCondition(filterheal,__bu1,"bu1"); filterheal=checkCondition(filterheal,__bu2,"bu2"); filterheal=checkCondition(filterheal,__bu3,"bu3"); filterheal=checkCondition(filterheal,__bu4,"bu4"); filterheal=checkCondition(filterheal,__bu5,"bu5"); filterheal=checkCondition(filterheal,__branchid,"branch"); filterheal=checkCondition(filterheal,__jobid,"job"); __fixCon.value=filterheal; } } function checkCondition(filcon,objname,targetname){ with(document.cscform){ if(objname.value.length>0){ filcon=checkFilter(filcon); filcon+= targetname+"='"+objname.value+"'"; } return filcon; } } function checkCondition2(filcon,objname1,objname2,targetname){ // For EmployeeID (Between) with(document.cscform){ var emp1 = objname1.value; var emp2 = objname2.value; if(emp1 === "" && emp2===""){ return filcon; }else if(emp1 === ""){ emp1 = emp2; }else if(emp2 === ""){ emp2 = emp1; } filcon = checkFilter(filcon); filcon += targetname+" between '"+emp1+"' and '"+emp2+"'"; return filcon; } } function checkFilter(fil){ if(fil.length>0) fil+=" and "; return fil; } function GoProcess(){ //Send to process with(document.cscform){ var lang = '<%=screen.getUProfile().get("lang")%>'; //1. Check Require Field var getStartDate = __startdate.value; var getToDate = __todate.value; var getTdesc = __tdesc.value; var getBudgetID = __manid.value; if(getStartDate == ""||getToDate == ''){ if(lang === 'eng'){ alert("'Start Date' or 'End Date' must not be null."); }else{ alert("ค่า Start Date หรือ End Date จะต้องไม่เป็นค่าว่าง"); } }else if(getTdesc == ''){ if(lang === 'eng'){ alert("'Description(Thai)' must not be null."); }else{ alert("รายละเอียดภาษาไทยจะต้องไม่เป็นค่าว่าง"); } }else if(getBudgetID == ''){ if(lang === 'eng'){ alert("'Manpower Budget ID' must not be null."); }else{ alert("รหัสงบประมาณกำลังคนจะต้องไม่เป็นค่าว่าง"); } }else if(getStartDate == getToDate){ if(lang === 'eng'){ alert("'Start Date' and 'End Date' must not be the same."); }else{ alert("ค่า Start Date และ End Date จะต้องไม่เป็นค่าเดียวกัน"); } } else{ //2. Check StartDate and Enddate = Sent to DWR if(__condition$budid.value != ''){ GoSearch(); //__condition$budid.value = __manid.value; __condition$tdesc.value = __tdesc.value; __condition$edesc.value = __edesc.value; __condition$branch.value = __branchid.value; __condition$bu1.value = __bu1.value; __condition$bu2.value = __bu2.value; __condition$bu3.value = __bu3.value; __condition$bu4.value = __bu4.value; __condition$bu5.value = __bu5.value; __condition$jobid.value = __jobid.value; __condition$start_date.value = __startdate.value; __condition$end_date.value = __todate.value; __condition$gen_type.value = __Generate_Type.value; __condition$fixcon.value = __fixCon.value; $("input[name='__condition$plan_active']").val($("input[name=__plan_active]:checked").val()); $("input[name='__condition$plan_status']").val($("input[name=__plan_status]:checked").val()); if(__Generate_Type.value == 'ClearOnly'){ __ename.value = "Generate Manpower Budget(ClearOnly) ID = "+__condition$budid.value; __tname.value = "สร้างข้อมูลงบประมาณกำลังคน(ClearOnly) ID = "+__condition$budid.value; }else if(__Generate_Type.value == 'CreateOnly'){ __ename.value = "Generate Manpower Budget(CreateOnly) ID = "+__condition$budid.value; __tname.value = "สร้างข้อมูลงบประมาณกำลังคน(CreateOnly) ID = "+__condition$budid.value; }else{ __ename.value = "Generate Manpower Budget(ClearAndCreate) ID = "+__condition$budid.value; __tname.value = "สร้างข้อมูลงบประมาณกำลังคน(ClearAndCreate) ID = "+__condition$budid.value; } __cmd.value = "save"; submit(); }else{ //ManpowerBudget.CheckPeriodDate(getStartDate,getToDate,AfterCheckPeriodDate); AfterCheckPeriodDate('ok'); } } } } function AfterCheckPeriodDate(data){ with(document.cscform){ if(data != 'ok'){ alert(data); }else{ //3. Send to Process GoSearch(); __condition$budid.value = __manid.value; __condition$tdesc.value = __tdesc.value; __condition$edesc.value = __edesc.value; __condition$branch.value = __branchid.value; __condition$bu1.value = __bu1.value; __condition$bu2.value = __bu2.value; __condition$bu3.value = __bu3.value; __condition$bu4.value = __bu4.value; __condition$bu5.value = __bu5.value; __condition$jobid.value = __jobid.value; __condition$start_date.value = __startdate.value; __condition$end_date.value = __todate.value; __condition$gen_type.value = __Generate_Type.value; __condition$fixcon.value = __fixCon.value; $("input[name='__condition$plan_active']").val($("input[name=__plan_active]:checked").val()); $("input[name='__condition$plan_status']").val($("input[name=__plan_status]:checked").val()); __cmd.value = "save"; submit(); } } } function saveManPower() { var jsonArray = []; var budid = $("input[name=__manid]").val(); var tdesc = $("input[name=__tdesc]").val(); var edesc = $("input[name=__edesc]").val(); var jobid = $("input[name=__jobid]").val(); var branch = $("input[name=__branchid]").val(); var bu1 = $("input[name=__bu1]").val(); var bu2 = $("input[name=__bu2]").val(); var bu3 = $("input[name=__bu3]").val(); var bu4 = $("input[name=__bu4]").val(); var bu5 = $("input[name=__bu5]").val(); var start_date = $("input[name=__startdate]").val(); var end_date = $("input[name=__todate]").val(); var active = $("input[name=__plan_active]:checked").val(); var status = $("input[name=__plan_status]:checked").val(); jsonArray.push({"budid":budid,"tdesc":tdesc,"edesc":edesc,"jobid":jobid,"branch":branch,"bu1":bu1,"bu2":bu2,"bu3":bu3,"bu4":bu4,"bu5":bu5,"start_date":start_date,"end_date":end_date,"active":active,"status":status}); waitingDialog.show('Processing'); ManpowerBudget.saveManpowerBudget(JSON.stringify(jsonArray), function(data){ waitingDialog.hide(); alert(data); }); } </script> </head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <form name="cscform" method="post" action ="MANPOWER_GEN.jsp"> <!----------BEGIN CSC INITIAL ZONE ------------------------> <%=screen.InitialVariable()%> <input type="hidden" name="__cmd" value="<%=request.getParameter("__cmd")%>"> <input type="hidden" name="__screen" value="MANPOWER_GEN"> <input type="hidden" name="__help" value=""> <input type="hidden" name="__calendar" value=""> <script language="javascript">getInputFormatDate();</script> <input type="hidden" name="__companyid" value="<%=screen.getUProfile().get("companyid")%>"> <input type="hidden" name="__referPage" value=""> <input type="hidden" name="__fixCon" value=""> <input type="hidden" name="__language" value="<%=screen.getUProfile().get("lang")%>"> <!-- For process class --> <input type="hidden" name="__getEmpJS" value=""> <input type="hidden" name="__process" value=""> <input type="hidden" name="__ptype" value=""> <input type="hidden" name="__tname" value="สร้างข้อมูลงบประมาณกำลังคน"> <input type="hidden" name="__ename" value="Generate Manpower Budget"> <input type="hidden" name="__prclass" value="GenerateManpowerBudget"> <input type="hidden" name="__condition$budid" value=""> <input type="hidden" name="__condition$tdesc" value=""> <input type="hidden" name="__condition$edesc" value=""> <input type="hidden" name="__condition$branch" value=""> <input type="hidden" name="__condition$bu1" value=""> <input type="hidden" name="__condition$bu2" value=""> <input type="hidden" name="__condition$bu3" value=""> <input type="hidden" name="__condition$bu4" value=""> <input type="hidden" name="__condition$bu5" value=""> <input type="hidden" name="__condition$jobid" value=""> <input type="hidden" name="__condition$start_date" value=""> <input type="hidden" name="__condition$end_date" value=""> <input type="hidden" name="__condition$gen_type" value=""> <input type="hidden" name="__condition$fixcon" value=""> <input type="hidden" name="__condition$plan_active" value=""> <input type="hidden" name="__condition$plan_status" value=""> <input type="hidden" name="__pactive" value=""> <input type="hidden" name="__pstatus" value=""> <!----------END CSC INITIAL ZONE --------------------------> <div align="center"> <table height="" align="center" cellpadding="0" cellspacing="0" border="1" class="largest"> <tr bgcolor="#3366CC"> <td height="20" class="header" colspan="4">MANPOWER_GEN,<span swlang code="SW012680">Generate Manpower Budget</span> </td> </tr> <tr> <td class="blankspace" colspan="4"></td> </tr> <tr> <td align="right"><strong><swaplang code='SW011723'>Manpower Budget ID</swaplang> </strong></td> <td colspan="3"><input type="text" name="__manid" size="15" value=""> <a href="javascript:goHelp('MMANPOWER_BUDHELP','__manid')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="Image2" border="0" align="absmiddle"></a></td> </tr> <tr> <td align="right"><span swlang code="SW013104">Manpower Name(Thai)</span> </td> <td colspan="3"><input type="Text" name="__tdesc" size="50" maxlength="100" value="" onkeypress="chkSpecialStr(event);" onkeyup="sysIsEdit();" onblur="trimValue(this);" onfocus="this.select();" alt="Description(Thai)" onmousemver="toolTip('Description(Thai)')" onmouseout="toolTip()"></td> </tr> <tr> <td align="right"><span swlang code="SW013105">Manpower Name(Eng)</span> </td> <td colspan="3"><input type="Text" name="__edesc" size="50" maxlength="100" value="" onkeypress="chkSpecialStr(event);" onkeyup="sysIsEdit();" onblur="trimValue(this);" onfocus="this.select();" alt="Description(Eng)" onmousemver="toolTip('Description(Eng)')" onmouseout="toolTip()"></td> </tr> <tr> <td align="right"><span swlang code="SW000910">Company Branch</span> </td> <td colspan="3"><input type="text" name="__branchid" size="15" value=""> <a href="javascript:goHelp('MBRANCHHELP','__branchid')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('imgBu1','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="imgBu1" border="0" align="absmiddle"></a> <input name="__branch_desc" type="text" value="" size="35" readonly=""></td> </tr> <% DbRecord mbu = new InitialRecord(screen.getUProfile()).getDbRecord("memployee"); %> <tr style="display:none"> <td align="right"><%=mbu.getField("bu1").getDescription()%> </td> <td colspan="3"><input type="text" name="__bu1" size="15" value=""> <a href="javascript:goHelp('MBU1HELP','__bu1')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('imgBu1','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="imgBu1" border="0" align="absmiddle"></a> <input name="__bu1_desc" type="text" value="" size="35" readonly=""></td> </tr> <tr style="display:none"> <td align="right"><%=mbu.getField("bu2").getDescription()%> </td> <td colspan="3"><input type="text" name="__bu2" size="15" value=""> <a href="javascript:goHelp('MBU2HELP','__bu2')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('imgBu2','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="imgBu2" border="0" align="absmiddle"></a> <input name="__bu2_desc" type="text" value="" size="35" readonly=""></td> </tr> <tr style="display:none"> <td align="right"><%=mbu.getField("bu3").getDescription()%> </td> <td colspan="3"><input type="text" name="__bu3" size="15" value=""> <a href="javascript:goHelp('MBU3HELP','__bu3')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('imgBu3','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="imgBu3" border="0" align="absmiddle"></a> <input name="__bu3_desc" type="text" value="" size="35" readonly=""></td> </tr> <tr style="display:none"> <td align="right"><%=mbu.getField("bu4").getDescription()%> </td> <td colspan="3"><input type="text" name="__bu4" size="15" value=""> <a href="javascript:goHelp('MBU4HELP','__bu4')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('imgBu4','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="imgBu4" border="0" align="absmiddle"></a> <input name="__bu4_desc" type="text" value="" size="35" readonly=""></td> </tr> <tr style="display:none"> <td align="right"><%=mbu.getField("bu5").getDescription()%> </td> <td colspan="3"><input type="text" name="__bu5" size="15" value=""> <a href="javascript:goHelp('MBU5HELP','__bu5')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('imgBu5','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="imgBu5" border="0" align="absmiddle"></a> <input name="__bu5_desc" type="text" value="" size="35" readonly=""></td> </tr> <tr style="display:none"> <td align="right"><span swlang code="SW000780">Job Title</span> </td> <td colspan="3"><input type="text" name="__jobid" size="15" value=""> <a href="javascript:goHelp('MJOBCODEHELP','__jobid')" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('imgBu1','','../IMAGES/BUTTON/SWAP/SEARCH_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/SEARCH20.gif" alt="Help" name="imgBu1" border="0" align="absmiddle"></a> <input name="__job_desc" type="text" value="" size="35" readonly=""></td> </tr> <tr> <td align="right"><span swlang code="SW012667">Plan Period</span> </td> <td colspan="3"> <swaplang code='SW000306'>Start Date</swaplang> <input type="calendar" name="__startdate" size="10" maxlength="10" value="" onkeypress="chkInteger(event);" onkeyup="sysIsEdit();formatDate(this);" onblur="chkInputDate2(this,document.cscform.__todate)" onfocus="this.select();" alt="Start Date" onmousemver="toolTip('Start Date')" onmouseout="toolTip()"> <a href="javascript:;" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image12','','../IMAGES/BUTTON/SWAP/CALENDAR_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/CALENDAR20.gif" alt="Calendar" name="Image12" width="20" border="0" align="absmiddle" id="Image12" onclick="viewCal('__startdate')"></a> <swaplang code='SW000276'>End Date</swaplang> <input type="calendar" name="__todate" size="10" maxlength="10" value="" onkeypress="chkInteger(event);" onkeyup="sysIsEdit();formatDate(this);" onblur="chkInputDate2(document.cscform.__startdate,this)" onfocus="this.select();" alt="To Date" onmousemver="toolTip('To Date')" onmouseout="toolTip()"> <a href="javascript:;" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image12','','../IMAGES/BUTTON/SWAP/CALENDAR_SWAP20.gif',1)"><img src="../IMAGES/BUTTON/MAIN/CALENDAR20.gif" alt="Calendar" name="Image12" width="20" border="0" align="absmiddle" id="Image12" onclick="viewCal('__todate')"></a> </td> </tr> <tr> <td><div align="right"><span swlang code="SW012682">Generate Type</span> </div></td> <td colspan="3"> <select name="__Generate_Type"> <option value="ClearAndCreate"><%=language.equals("eng")?"Clear and Create":"ล้างและสร้างข้อมูล"%></option> <option value="CreateOnly"><%=language.equals("eng")?"Create Only":"สร้างข้อมูลเท่านั้น"%></option> <option value="ClearOnly"><%=language.equals("eng")?"Clear Only":"ล้างข้อมูลเท่านั้น"%></option> </select> </td> </tr> <tr> <td><div align="right"><span swlang code="SW012668">Plan Active</span> </div></td> <td colspan="3"> <input name="__plan_active" type="radio" value="1" checked><span swlang code="SW012666">Active</span> <input name="__plan_active" type="radio" value="0"><span swlang code="SW012665">Inactive</span> </td> </tr> <tr> <td><div align="right"><span swlang code="SW012669">Plan Status</span> </div></td> <td colspan="3"> <input name="__plan_status" type="radio" value="0" checked><span swlang code="SW012675">Open</span> <input name="__plan_status" type="radio" value="1"><span swlang code="SW012676">Closed</span> </td> </tr> <tr> <td class="blankspace" colspan="4"></td> </tr> <tr> <td class="buttonline" colspan="7"><div align="center"> <button type="button" class="btn btn-primary width100" swlang code="SW013175" onClick="saveManPower();">OK</button> <button type="button" class="btn btn-primary width100" swlang code="SW013176" onClick="GoProcess();">BACK</button> </div> </td> </tr> <tr> <td class="blankspace" colspan="4"></td> </tr> <tr> <td class="bottom" colspan="4"> </td> </tr> </table> </div> </form> </body> <script> //Credit by Nheung(Chamnan) var waitingDialog = waitingDialog || (function ($) { 'use strict'; // Creating modal dialog's DOM var $dialog = $( '<div class="modal fade" data-backdrop="static" data-keyboard="false" tabindex="-1" role="dialog" aria-hidden="true" style="padding-top:15%; overflow-y:visible;">' + '<div class="modal-dialog modal-m">' + '<div class="modal-content">' + '<div class="modal-header"><h3 style="margin:0;"></h3></div>' + '<div class="modal-body">' + '<div class="progress progress-striped active" style="margin-bottom:0;"><div class="progress-bar" style="width: 100%"></div></div>' + '</div>' + '</div></div></div>'); return { show: function (message, options) { // Assigning defaults if (typeof options === 'undefined') { options = {}; } if (typeof message === 'undefined') { message = 'Loading'; } var settings = $.extend({ dialogSize: 'm', progressType: '', onHide: null // This callback runs after the dialog was hidden }, options); // Configuring dialog $dialog.find('.modal-dialog').attr('class', 'modal-dialog').addClass('modal-' + settings.dialogSize); $dialog.find('.progress-bar').attr('class', 'progress-bar'); if (settings.progressType) { $dialog.find('.progress-bar').addClass('progress-bar-' + settings.progressType); } $dialog.find('h3').text(message); // Adding callbacks if (typeof settings.onHide === 'function') { $dialog.off('hidden.bs.modal').on('hidden.bs.modal', function (e) { settings.onHide.call($dialog); }); } $dialog.modal(); }, hide: function () { $dialog.modal('hide'); } }; })(jQuery); </script> </html>