set time out in JavaScript

Question

Firefox always loads dynamic images, but IE it just shows images without any dynamic action. what changes I need to do?

JavaScript code from IE view source code:

<script type=”text/javascript”
    <!--/*--><![CDATA[/*><!--*/ 
    if (document.getElementById("safeForm1d3").submitted.value == "false") { 
      document.getElementById("safeForm1d3").submitted.value = "true"; 
      setTimeout('document.getElementById("safeForm1d3").submit()', 100); 
    }else{ 
    document.getElementById("toHide").style.display="none"; 
    }/*-->]]>*/
</script>

I am using Wicket framework, so real java code is:

 static private class SafeSubmitBehaviour extends AbstractBehavior{
    public void onRendered( Component component ) {
      super.onRendered( component );      
      StringBuffer buffer = new StringBuffer(200);
      buffer.append("<script type=\"text/javascript\" ><!--/*--><![CDATA[/*><!--*/\n");
      buffer.append("if (document.getElementById(\"").append(component.getMarkupId()).append("\").submitted.value == \"false\") {\n");
      buffer.append("document.getElementById(\"").append(component.getMarkupId()).append("\").submitted.value = \"true\";\n");
      buffer.append("setTimeout('document.getElementById(\"").append(component.getMarkupId()).append("\").submit()', 100);\n}else{\n");
      buffer.append("document.getElementById(\"toHide\").style.display=\"none\";\n}/*-->]]>*/</script>");      
      component.getResponse().write(buffer);
    }  
  } 

html page which loads my dynamic image is:

<div id="toHide" class="pb-text-align-center">
        <img style="display: inline" src="img/load.gif" />
            <form wicket:id="safeForm" class="clearfix">
            <input type="hidden" wicket:id="submitted" value="false" />
        </form>
</div>

Answer 1

This:

setTimeout(function(){'document.getElementById("safeForm4d").submit()'}, 100);

is incorrect. The function you pass there to ".setTimeout()" will do nothing. Instead of that, try:

setTimeout(function(){ document.getElementById("safeForm4d").submit(); }, 100);

The difference is that the actual guts of the function should not have been quoted. In that state, what you've got is a function with a single statement, that statement being a simple string-valued expression. It would run, but have no effect.

Answer 2

After formatting your initial post I think maybe I found some sources to the problem.

• The function in your timeout is a string.
• You should try and submit the form, not the actual button.

Try this:

if (!document.getElementById("safeForm4d").submitted.value) {
    document.getElementById("safeForm4d").submitted.value = "true";
    setTimeout(function() {
        document.forms[0].submit(); // Alt: document.forms['MyFormName'].submit()
    }, 3000);
} else {
    document.getElementById("toHide").style.display="none";
}

Answer 3

Take away the quotes from around your action:

setTimeout(function() {
    document.getElementById("safeForm4d").submit();
}, 3000);

Answer 4

I have tried with adding function call, now images are loading and dynamic, but it never goes to next page or never clear timeout.

code:

buffer.append("setTimeout(function(){'document.getElementById(\"").append(component.getMarkupId()).append("\").submit()'}, 100);\n}else{\n");

Answer 5

setTimeout(function (){ document.getElementById("safeForm").submit() } , 100);

check working example at JSFIDDLE.

CAUTION:: alert may be irritating.