Forum Moderators: open

Message Too Old, No Replies

Safari and Javascript Problems

document.forms[0].submit()

         

stevenmusumeche

7:51 pm on May 25, 2004 (gmt 0)

10+ Year Member



I am having a strage problem with Safari and submitted a form using javascript. I don't have a Mac so I can't really test this on my own. This problem doesn't seem to occur on any other browsers. I have tested in IE, Mozilla, Firefox, and Opera. The function is used to make a button "disabled" to prevent multiple clicking.

Here is the javascript function:


function disableButton(theButton)
{
theButton.value="Processing...";
theButton.disabled = true;
document.forms[0].submit();
}

And here is the form that calls the function:

<form onSubmit="disableButton(document.form1.submit2);" method="post" action="" style="margin:0" name="form1" id="form1">
<OTHER STUFF REMOVED FOR BREVITY>
<input type="submit" name="submit2" value="SUBMIT ORDER">
</form>

----------
Like I said, I have tested this in Mozilla, Opera, IE, etc, and haven't had any problems or even javascript warnings. Any ideas?

Rambo Tribble

10:39 pm on May 25, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Why not use a type="button" button, since it isn't being used for submit, and simply calling your function with it? You can still have it say "submit", but your function would handle all actual submit activity. You wouldn't even need to invoke the onsubmit handler, then.

dcrombie

11:01 am on May 26, 2004 (gmt 0)



I would try something like:

function disableButton(theButton)  
{
theButton.value="Processing...";
theButton.disabled = true;
return true;
}

And here is the form that calls the function:

<FORM onSubmit="return disableButton(this.submit2);" method="post" action="">  
...
<INPUT type="submit" name="submit2" value="SUBMIT ORDER">
</FORM>

Works fine in Safari at least ;)

MichaelBluejay

11:18 am on May 26, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Uh... What exactly is the problem?

stevenmusumeche

4:41 pm on May 27, 2004 (gmt 0)

10+ Year Member



The function gets executed (the button is disabled and the text changes) but the form does not actually get submitted. So, the page just sits there. I will try these recommendations and let you know.

Thanks for the help.

Rambo Tribble

4:20 pm on May 28, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Possibly, Safari has problems with the JavaScript, in particular the submit() method (Safari has a number of deficiencies with JS & CSS). A reason to keep the type=submit is if the user has JS turned off. Gotta go to work, but will address this further this evening.

dcrombie

4:40 pm on May 28, 2004 (gmt 0)



I think it's more that the Safari JS engine was written based on the standards rather than the other way around. It seems to be more strict regarding the return values (true/false) of event handlers.

The problem with Safari's JS is mostly that it doesn't include a debugger or events window.

normaldude

5:13 pm on May 28, 2004 (gmt 0)

10+ Year Member



Try This:

<form name="form1" method="post"
action="http://www.domain.com/xyz.php"
onSubmit="this.submit2.disabled=true;this.submit2.value='Processing...'">

<input type="submit" name="submit2" value="Submit Order">
</form>

Rambo Tribble

2:02 am on May 29, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



It's a little tough to tell what's hanging Safari without having it to test. Given your original code, it would appear that the submit() method is not being executed by Safari.

I went to the Apple site, but couldn't find much info regarding Safari bugs and limitations. They don't appear to be particularly forthcoming, for an open-source project. If you have access to a Linux box, you might try using Konquerer to test, as Safari is based on it.

Another approach might be to allow the standard submit action of the form to execute, after a function called by onsubmit determines that it is the first submission and returns "true"; conversely if the function finds that a submission has already been made, it could return "false". This would actually be a more "standard" approach.

stevenmusumeche

2:20 am on Jun 15, 2004 (gmt 0)

10+ Year Member



I just wanted to thank dcrombie and let you guys know what the solution was.

function disableButton(theButton)
{
theButton.value="Processing...";
theButton.disabled = true;
return true;
}

<FORM onSubmit="return disableButton(this.submit2);" method="post" action="">
...
<INPUT type="submit" name="submit2" value="SUBMIT ORDER">
</FORM>

I tested this on Konqueror for Linux and it worked fine. I would still like to test it on a real mac with Safari. Is there anyone out there willing to test for me? If so, please sticky me and I'll send you the URL.

Thanks!