Oracle APEX Progress Bar Implementation for long running process.
Step 1 - Copy the Progress Bar image gif to images folder
Step 2 - For Processing Butting add the below code in the button target window
javascript:html_Submit_Progress(this);
Step 3 - Add below code to Page HTML footer Attribute
< style> #AjaxLoading{padding:5px;font-size:18px;width:200px;text-align:center;left:50%;top:50%;position:absolute;border:2px solid #666;background-color:#FFF;}
< /style>
< div id="AjaxLoading" style="display:none;">..Loading..
< img src="/i/carl/theme_200/processing3.gif" id="wait" />< /div>
Step 4 - Add below code to Page HTML header Attribute
< script type="text/javascript">
< !--
function html_Submit_Progress(pThis){
$x_Show('AjaxLoading');
window.setTimeout('$s("AjaxLoading",$x("AjaxLoading").innerHTML)', 100);
doSubmit('APPLY_CHANGES');
}
function submit_HideAll(pThis){
$x_Hide('wwvFlowForm');
doSubmit('APPLY_CHANGES');
}
function submit_ButtonRegion(pThis){
$x_Hide('button_region');
doSubmit('APPLY_CHANGES');
}
//-- >
< /script>
Step 5 - doSubmit('APPLY_CHANGES') where APPLY_CHANGES is the processing button name
Apply the changes and you are ready to view the Progress bar when page is processing.
