javascript rollover submit issue in M$IE

JavaScript and client side scripting.

Moderator: General Moderators

m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

javascript rollover submit issue in M$IE

Post by m3rajk »

problem is that while mozilla, netscape and such have it work fine,
Microsoft Internet Error has a little issue that's causing a massive headache. asking about it on the msdn got nothing.

thread with operating system/browser failures during some testing this weekend:
http://www.findyourdesire.com/forums.php?tid=225

code for the submit:

Code: Select all

function subfrm(choice){ document.getElementById(choice).submit(); return true; } // submit a form
there's two variations that seem to work in M$IE no matter where they are. that one only works for hte navigation bar.

example of variation:

Code: Select all

function subsel(form,hfld,hval,hfld2,hval2){ // submit a form and set a hidden variable
  document.getElementById(hfld).value=hval;
  document.getElementById(hfld2).value=hval2;
  document.getElementById(form).submit();
  return true;
}
forms not working:

Code: Select all

<form action="login.php" id="verify" name="verify" method="POST">
		<span id="vtp">Member Name:&nbsp;<input id="mem" name="mem" maxlength="15" size="15" type="text" /> Password:&nbsp;<input id="pass" name="pass" maxlength="15" size="15" type="password" /></span> <a href="#" onclick="subfrm('verify');" onmouseout="deselopt('lgn',usr);" onmouseover="selopt('lgn',usr);" target="_top"><img alt="Login Now!" id="lgn" name="lgn" src="sitepics/lgnoff.png" title="Login Now!" /></a><span id="vtp"> or <a href="http://www.findyourdesire.com/join.php" target="_top">Join</a> now to Rate others!</span>
	      </form>

Code: Select all

<form action="/login.php" id="vrfy" name="vrfy" method="POST">
	<table cellspacing="0" class="regnw">
          <tbody>
	    <tr><td>Your Member Name</td><td><input id="mem" name="mem" maxlength="15" size="15" type="text" value="" /></td></tr>
	    <tr><td>Your Password</td><td><input id="pass" name="pass" maxlength="15" size="15" type="password" /></td></tr>
	    <tr><td><a href="http://www.findyourdesire.com/pass.php">Lost Your PW?</a></td><td><a href="#" onclick="subfrm('vrfy');" onmouseout="deselopt('lgn',usr);" onmouseover="selopt('lgn',usr);" target="_top"><img alt="Login Now!" id="lgn" name="lgn" src="sitepics/lgnoff.png" title="Login Now!" /></a></td></tr>
          </tbody>

	</table>
      </form>
M$internet error brings you to the page you're on with a #

everything else submits to login.php

the second gets the page via the php variable $_SERVER['PHP_SELF']

it seems like M$IE will only let one thing call the function.

anyone have any clues how this issue can be remedied?
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

getElementById() is not a function supported and exposed by IE.
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

lmao. i thought it was a standard..
that makes it really confuding that it actually works in SOME instances then.
any clue why M$ decided not to support it?

how would you adapt the function for internet error.

i cant even think of how it's work... all i can think of is document.variable.submit(); and i'm not sure that would work...
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

Code: Select all

function getElem(id) &#123; return (document.getElementById ? document.getElementById(id) : document.all&#1111;id]); &#125;

function subsel(form,hfld,hval,hfld2,hval2)&#123; // submit a form and set a hidden variable 
  getElem(hfld).value=hval; 
  getElem(hfld2).value=hval2; 
  getElem(form).submit(); 
  return true; 
&#125;
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

could you explain what's going on in the getElm function?
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

check for the existance of getElementById(), uses it if it's there.. otherwise, uses the all array..
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

thanx. i didn't know how to get around that without hard coding the document.element.whatever.

it'd be nice if microsoft actually made something that understood whateveryone else understands.
it's bad enough that every time a program updates it resets my defaults to microsoft, and wont recognise that i have java 2 runtime environment (actually have it as part of the java2 jdk)

i swear his oses are blatantly breaking the anti-trust laws and becasue he pays off bush bush is making the government look the other way.

he needs to be burned at the stake, but i doubt that'd be enough of an example at this point.
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

grrr. just tried it on win xp pro with ie 6.0.28....
http://www.findyourdesire.com/forums.php?tid=225#p1372

while it's working fine in mozilla and all the things are right, it's still not working for that os/ie combo
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

you know, this probably wouldn't have been a problem if you used <input type="image"> instead of linking on a graphic.. relying on javascript isn't good design in most cases.
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

keeping it a rolllover like the graphic person wanted required using javascript. even with that i would still need javascript to set hiddens in some places.

i dont know any way to get <input type="image"...> to do image swaps.
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

i just realized all the buttons in hotmail are rollovers, which means that this MUST be possible in ie. i'm going to look at that source. if someone knows how, bplease feel free to save me a headache and explain it
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

example from hotmail....

the save button.....

Code: Select all

<td class="P" nowrap onmouseover="MO()" onmouseout="MU()" onclick="Mail('Save')"><img src="http://64.4.55.45/i.p.folder.drafts.gif" border=0 align=absmiddle hspace=1 alt="Drafts"> Save Draft</td>
and from farther down the page....

Code: Select all

</form>
<script language="JavaScript">
var frm = document.composeform;
var BccB = document.all.ButtonBcc;

function Save()
&#123;
var bSbmt = true;
if (bSbmt)
&#123;
frm._HMaction.value="Save";
frm.submit();
&#125;
&#125;
and damn. the entire page has only one form.
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

since document.all[id] and document.forms[id] doesnt work to select a form, i'm thinking i need to hardwire the form. the issue is that i have multiple forms. only thing i can think of shouldnt work.... document.id
m3rajk
DevNet Resident
Posts: 1191
Joined: Mon Jun 02, 2003 3:37 pm

Post by m3rajk »

ok.

Code: Select all

getElem(id)&#123; return document.id; &#125;
and

Code: Select all

getElem(id)&#123; return 'document.'+id; &#125;
both fail.
any other ideas?
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

getting rollovers to work with the image is fairly simple

Code: Select all

<input type="image" src="whatever.png" onmouseover="roll(this)" onmouseout="out(this)" />
Post Reply