R
ripsnorter
Hello,
I'm developing an ajax type aplication, targeted at IE6, and some times
my methods take a while to return. I would like a message box to
appear whilest this happens. Below is my attempt at that.
In javascript I have functions like this:
function showMessageBox()
{
document.getElementById('back').disabled = true;
document.getElementById('logout').disabled = true;
document.getElementById('init').disabled = true;
document.getElementById('msgbox').style.visibility = "visible";
}
function hideMessageBox()
{
document.getElementById('back').disabled = false;
document.getElementById('logout').disabled = false;
document.getElementById('init').disabled = false;
document.getElementById('msgbox').style.visibility = "hidden";
}
function doSomething()
{
showMessageBox();
doSomething2();
hideMessageBox();
}
And in the HTML I have code like this:
*********************************************
<div id="msgbox" align="center" style="z-index: 3; background:white;
visibility: hidden; border-width: thin; border-color: black;
border-style: solid; position: absolute; left: 200; top:
260;width:400px; height:120px">
<table width="100%" height="100%">
<tr>
<td style="text-align:center; font-weight: bold; font-size: x-large;
vertical-align:middle;">
Doing Something
</td>
</tr>
</table>
</div>
<button id="back" class="NavControl" onClick="">BACK</button>
<button id="logout" class="NavControl" onClick="">LOGOUT</button>
<button id="init" class="NavControl"
onClick="doSomething">INIT</button>
**************************************************
Now when I click the init button the styles don't seem to be applied
until the doSomething2() function returns, I've tested this by
commenting out the hideMessageBox() function. The net result of this
is that the message box doesn't become visable at all. Does anyone
know of a way to force these styles to be aplied?
TIA,
Craig Spry
I'm developing an ajax type aplication, targeted at IE6, and some times
my methods take a while to return. I would like a message box to
appear whilest this happens. Below is my attempt at that.
In javascript I have functions like this:
function showMessageBox()
{
document.getElementById('back').disabled = true;
document.getElementById('logout').disabled = true;
document.getElementById('init').disabled = true;
document.getElementById('msgbox').style.visibility = "visible";
}
function hideMessageBox()
{
document.getElementById('back').disabled = false;
document.getElementById('logout').disabled = false;
document.getElementById('init').disabled = false;
document.getElementById('msgbox').style.visibility = "hidden";
}
function doSomething()
{
showMessageBox();
doSomething2();
hideMessageBox();
}
And in the HTML I have code like this:
*********************************************
<div id="msgbox" align="center" style="z-index: 3; background:white;
visibility: hidden; border-width: thin; border-color: black;
border-style: solid; position: absolute; left: 200; top:
260;width:400px; height:120px">
<table width="100%" height="100%">
<tr>
<td style="text-align:center; font-weight: bold; font-size: x-large;
vertical-align:middle;">
Doing Something
</td>
</tr>
</table>
</div>
<button id="back" class="NavControl" onClick="">BACK</button>
<button id="logout" class="NavControl" onClick="">LOGOUT</button>
<button id="init" class="NavControl"
onClick="doSomething">INIT</button>
**************************************************
Now when I click the init button the styles don't seem to be applied
until the doSomething2() function returns, I've tested this by
commenting out the hideMessageBox() function. The net result of this
is that the message box doesn't become visable at all. Does anyone
know of a way to force these styles to be aplied?
TIA,
Craig Spry