[RESOLVED] Cross Browser Compatible form.submit

Krik

Well been reading here for about an hour and have read all over the web for 5 hours. And I just cannot find anywhere it is throughly adressed.

document.getElementById(calformsid).submit();

works

FireFox

document.forms[calformsid].submit();

works

Sarfari

none of the above works plus I tried:

document.calformsid.submit();
window.document.calformsid.submit();
window.document.getElementById(calformsid).submit();
window.document.forms[calformsid].submit();
eval('document.' + calformsid + '.submit()');
eval('document.forms[' + calformsid + '].submit()');
eval('document.getElementById(' + calformsid + ').submit()');
eval('window.document.' + calformsid + '.submit()');
eval('window.document.forms[' + calformsid + '].submit()');
eval('window.document.getElementById(' + calformsid + ').submit()');

I know some of that is technically the same as some of the others listed but was just trying to make sure all these anti W3C standards browsers weren't trying to pull a fast one on me.

I saw one suggestion (while reading around) that the "s" in the submit may need to be caitalized in some browsers. Haven't tested that yet as I am hoping for some clearer direction.

To give you a better picture of what I am doing. I am having an onclick event submit a form with a hidden field so as to pass a date to the next page for the user to submit some additional data related to the date. The date is selected from a php generated calendar that has perdefined days that the user can access. As the calendar is so small a subimt button is impractical (and down right ugly). As well the date numerals are just readable and I would not pass such a curse on someone as to make them try and click a "1" so the onclick occurs in the <td> tag.

The onclick calls a javascript function and passes a dynamic form name that has a prefix with a compiled date to conicide with the date on the calendar.

$clickdetails = "onclick=\"GetSignupPage('F". $styledate ."')\" ";

'F". $styledate ."' == 'F20080619'

function GetSignupPage(calformsid) {

document.forms[calformsid].submit();

}

calformsid == 'F20080619'

So does anyone know how to get the submit to work in safari as well as some of the other major browsers that I haven't tested yet. A link to an exaustive discussion on making the submit cross browser compatible will do as well.

I know some of you may want all my code and if so be warned it is lengthy do to the amount of functionallity that is needed. But I think the answer should be the same irrelevant of my related code.

As well if there is beter way I am all ears.

Weedpacket

According to the W3C standards
http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-getElBId

And their implementations in various browsers
As such it's supported in FireFox: http://developer.mozilla.org/en/docs/DOM:document.getElementById
Safari: http://developer.apple.com/documentation/AppleApplications/Reference/WebKitDOMRef/a00025.html#236569e1e31170873da2198623027b9a
and even Internet Explorer: http://msdn.microsoft.com/en-us/library/ms536437(VS.85).aspx

document.getElementById(calformsid) should correctly retrieve the element that has an id attribute matching the value of calformsid. I've certainly never had any trouble with it (and certainly I haven't had to go to all those contortions you've listed for many years). So if it's not finding the object, the implication is that there is no <form> element with an id attribute of "Fnnnnnnn". After that, calling the form's submit() method shouldn't be any trouble either. So ... is there such a form? Is it in the page or do you construct the object directly? If it's in the page, perhaps constructing the form in Javascript would be easier.

If you can post actual code that illustrates the problem, please do so as it would be less ambiguous than second-hand descriptions. Leave out the irrelevant stuff: take out as much as you can while still leaving the relevant (incorrect) behaviour intact.

Incidentally, "a subimt button is impractical (and down right ugly)" - you're free to use CSS to style submit buttons in whatever way looks best: you could put a button in each "active" table cell and it could look however such a cell should look.

Krik

Pardon my ignorance but it looks like I made one of those old habits die hard mistakes.

I have known since who knows when that getElementById can only refer to an element with an ID assigned. But form my days of doing HTML and PHP prior to learning javascript I used a name tag. And then for reasons, bordering on insanity, I first tested in IE which made it look like it worked. And then when it didn't in the others I assumed things I shouldn't have.

So in conlclusion someone give Microsoft another good swift kick in the rear for me and NEVER use "name" to identify and element in your HTML.

I guess posting all my code would have found that problem quicker 😃

And for all other passerbys

function YourEventFunc(yourformsid) {
document.getElementById(yourformsid).submit();
}

works in all browsers. As long as the form has an "id" set and not a "name"

Weedpacket

Heh, another case of "if it's not cross-browser, then IE is the one doing it wrong" 🙂

Oh, sheesh, it's true. If it doesn't find an element with a matching ID, it looks for one that with a matching name attribute instead. Tell you what, if that fails, why don't we look at "alt" next....? We can't let our browser fail to load the page!

leatherback

well.. We all know that M$ rather does it incorrectly than not at all right ? 😃