force refresh/repaint screen while processing?

I have something like:

for(i=0; i<10; i++)
{
  document.all.textboxProcess.value = i;
  process(i);
}

But the value of textboxProcess is not updated until the loop finish.
How can I force screen refresh/repaint inside the loop?
LVL 6
HardiAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

splamungeCommented:
You have to give the GDI a timeslice, so it can repaint, try ...

<html>
  <body>
    <form>
      Test value here: <input type=text id="textboxProcess" name="textboxProcess" size=8 maxlength="8" value="-1">
    </form>
    <script language="javascript">
      var upperLimit = 10, updateTO = 0, msec = 100;
     
      function advanceTick(newTick){
        if(!newTick){newTick = 0;}
        if(newTick < upperLimit){
          document.all.textboxProcess.value = newTick.toString();
          newTick++;
          updateTO = window.setTimeout('advanceTick(' + newTick + ')', msec);
        }
      }
     
      onload=advanceTick;
    </script>
  </body>
</html>

... Adjust msec upward or downwards until it looks right.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
HardiAuthor Commented:
umm... thanks
so there is no way you can do such as
window.repaint;
or anything?

i'll try that advanceTick...
0
ZontarCommented:
Don't use document.all. You scripts will run much more efficiently without it, and your scripts will also run cross-browser.

Use document.forms[0].textboxPorcess.value or document.getElementById("textboxProcess").value instead:

<html>
<head>
<script language="javascript">
  var upperLimit = 10, msec = 200;

  function advanceTick()
  {
    var newTick = document.getElementById("textboxProcess").value;
    if(newTick < upperLimit)
    {
      document.forms[0].textboxProcess.value = ++newTick;
      timer = setTimeout("advanceTick()", msec);
    }
  }

  window.onload = advanceTick;
</script>
</head>
<body>
<form>
Test value here: <input type="text" id="textboxProcess" name="textboxProcess" size="8" maxlength="8" value="-1">
</form>
</body>
</html>

Also the toString() call isn't necessary, and you can just get the value from the text input.

This also has the advantage that it will work in all JS-capable browsers.
0
ZontarCommented:
> window.repaint;

Clientside JS doesn't give you that sort of fine-grained control over graphics/screen.

Remember, a Web browser is essentially just a glorified document viewer. ;^)
0
HardiAuthor Commented:
thanks splamunge and Zontar
my code is now messed up coz it's not that simple =P
but i know how to use setTimeout
and i'll start using getelementbyid =)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.