By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,971 Members | 890 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,971 IT Pros & Developers. It's quick & easy.

Strange Safari onClick problem

P: n/a
Hi,

I am trying to write a webpage that has a form on it, which gets
submitted when a button is pressed, but also has an onclick event
which does some DOM manipulation to display a waiting page.

The issue that I am facing is that in Safari, a blank screen is being
displayed rather than the waiting page. This is only happening if
there are form tags around the button

i.e., this works and brings up the waiting page:

<input type="submit" name="submit" onclick='return interstitial();'/>

whereas this does not:

<form method="get" action="<slow loading page>">
<input type="submit" name="submit" onclick='return
interstitial();'/>
</form>

This does not appear to be a problem in Firefox/IE. Has anybody else
faced this problem and would be willing to help me out with this?

Many thanks in advance,
Jacqui
Jun 27 '08 #1
Share this Question
Share on Google+
1 Reply


P: n/a
VK
On Apr 21, 12:57 pm, Jacqui <jasn...@ntlworld.comwrote:
Hi,

I am trying to write a webpage that has a form on it, which gets
submitted when a button is pressed, but also has an onclick event
which does some DOM manipulation to display a waiting page.

The issue that I am facing is that in Safari, a blank screen is being
displayed rather than the waiting page. This is only happening if
there are form tags around the button

i.e., this works and brings up the waiting page:

<input type="submit" name="submit" onclick='return interstitial();'/>

whereas this does not:

<form method="get" action="<slow loading page>">
<input type="submit" name="submit" onclick='return
interstitial();'/>
</form>

This does not appear to be a problem in Firefox/IE. Has anybody else
faced this problem and would be willing to help me out with this?
<form method="GET"
action="slow_loading_page.cgi"
target="hidden_frame"
onsubmit="return interstitial(this)">
<!-- other form elements -->
<input type="submit">
</form>
<iframe name="hidden_frame" src="blank.html"
style="display: none !important"></iframe>

where

where interstetial does validation, sets waiting message and returns
true

Because form submission means leaving the current page, you have to
dump the server output to a hidden frame, otherwise it has no sense to
display any DOM waiting message - they will disappear a ms later.

If you are using an ajaxoid to submit your form then respectively you
have to cancel form submission and do the job manually, in such case
iframe is not needed:

<form method="GET"
action="slow_loading_page.cgi">
<!-- other form elements -->
<input type="button" value="Submit"
onclick="interstitial(this.form)">
</form>

1) interstitial has to show waiting message first, then over
setTimeout proceed with form submission: otherwise the screen will
never be updated.
2) a fallback should be provided in case Javascript disabled. One of
options:

<script>
document.write(''.concat(
'<input type="button" value="Submit"',
' onclick="interstitial(this.form)">'));
</script>
<noscript>
<input type="submit">
</noscript>
Jun 27 '08 #2

This discussion thread is closed

Replies have been disabled for this discussion.