MSIE is the bane of the internet

March 28, 2007 6:35 AM

Annoying MIE Javascript/AJAX question: I'm making an Ajax site and am trying to get it to work with Explorer. It works perfectly in Firefox and Safari but not in Explorer, damn MS and their constant exceptions!

Basically I'm trying to have my javascript read my form without actually putting the form itself into the function.

I'm using javascript to call the following (it's reading a specific form field)

var example= document.forms["theform"].elements["theformfield"].value;

This works very nicely in all other browsers, but not MS! I want to read the form by just giving it the field and form address!

posted by Napierzaza to Computers & Internet (21 answers total)

What does it do instead of working in IE? Does it produce an error message? If so, what message?
posted by cerebus19 at 6:45 AM on March 28, 2007

Response by poster: Basically it does nothing at all. I run the following code and it returns a blank alert. The stupid thing is that it works presently in a sparse test page, but not in my actualy application. Is there any reason for this? I completely emptied out the function being called but it still resulted in a blank response in my app, and a positive correct response in my test page (bot IE!).

function testResults (sec) {
var TestVar = document.forms["frmSelect"].elements["post["+sec+"]"].value;

alert ("You typed: " + TestVar);
}
posted by Napierzaza at 7:16 AM on March 28, 2007

Response by poster: Basically this page :

http://www.javaworld.com/javaworld/jw-06-1996/javascript/testform.html

will work on its own, but not when I import it into my javascript file (amking appropriate changes).
posted by Napierzaza at 7:26 AM on March 28, 2007

Are your post["foo"] fields identified by name or ID?

According to this post (which is over three years old, so take it with a grain of salt), "[IE] has a nasty tendency to sometimes not at all add the form fields to the elements collection, however, so you must add them manually if that is the case." Whether that's still the case, I've no idea.

Maybe try adding an ID attribute to the form elements and using getElementById instead of the elements collection?
posted by Doofus Magoo at 7:29 AM on March 28, 2007

Ajax libraries like jquery can solve these problems for you.
posted by phrontist at 7:36 AM on March 28, 2007

Are you handling the error and dumping the exception? Because usually IE is more than happy to annoy the user with constant error messages.
posted by mrbugsentry at 7:43 AM on March 28, 2007

Response by poster: I'm getting the values by name, there are already a lot of forms setup so it's a nightmare to have to go and create IDs for them all.

I'm not getting any errors at all, not sure why not considering I would technically be calling an non-existant field (in IE's eyes).

I'll look at Jquery, thanks.
posted by Napierzaza at 7:48 AM on March 28, 2007

Response by poster: Uh, any hints on how to use Jquery for this? I'd rather not pick this apart, reconfig my entire site, and then learn it doesn't work.

Does this also function as an AJAX library?
posted by Napierzaza at 7:51 AM on March 28, 2007

How are you invoking this function? Is it via an event handler, and, if so, which one?
posted by cerebus19 at 8:28 AM on March 28, 2007

Does ie think document.forms["frmSelect"].elements["post["+sec+"]"] == null?
posted by mrbugsentry at 8:33 AM on March 28, 2007

Response by poster: it's via an onchange, the thing is that there _is_ and alert box, and the functions _is_ passing, but the actual field value is blank. So it sends off an ajax request with blank information and nothing happens.

An alert box pops up in IE and say "you typed " while in safari it's "you typed blah".

It doesn't say null, it's just blank.
posted by Napierzaza at 8:38 AM on March 28, 2007

Since it's an onchange, why not try changing the code like so:

function testResults(elem)
{
  alert(elem.value);
}

And then have the form element HTML like so:

<input type="text" name="foo" onchange="testResults(this)"/>

posted by cerebus19 at 9:00 AM on March 28, 2007

Actually, on second thought, I think the problem is more fundamental than that. I think the problem is that IE fires the onchange handler before the change is applied to the text field, so the function gets the old value (blank) not the new value.

Try changing it to use onkeyup instead, and see if that works.
posted by cerebus19 at 9:05 AM on March 28, 2007

Response by poster: Because I'm not always pulling the value from that particular element. Often I might take that element, but also another that can't be submitted into the function in "this" way.

Really? damn IE and onchange, however I don't think so, we're talking about pull-down menus (didn't mention that) so I should see the default value in place of the selected one, not a blank. Right? Either way onkeyup is a no go.
posted by Napierzaza at 9:39 AM on March 28, 2007

Response by poster: Seriously, how do I read forms with Jquery? It seems really cool and the ajax looks effecient, but how am I supposed to read form elements? There appears to be nothing in the API the describes finding something by it's name.
posted by Napierzaza at 9:58 AM on March 28, 2007

You're talking about a select element? IE doesn't support using value for a select element. You need to do this:

var e = forms["formName"].elements["elementName"];
alert(e.options[e.selectedIndex].value);

posted by cerebus19 at 10:29 AM on March 28, 2007

Oh, and the onchange handler should work fine, because IE handles it the way you'd expect for a select element, but not for a text element.
posted by cerebus19 at 10:31 AM on March 28, 2007

Response by poster: That doesn't work. It still returns a blank value in IE.


function testerino(party)
{
var e = document.forms["frmSelect"].elements[party];
alert(e.options[e.selectedIndex].value);
}





-eg-
A
B


posted by Napierzaza at 12:11 PM on March 28, 2007

Response by poster: ho hum, the stupid preview said it would show up differently, what's the use of preview if it's not a preview? Anyhow whatever I made that function and called on it, the function there works in safari and Firefox but not ie.

Just imagine html that is just a corresponding form.
posted by Napierzaza at 12:12 PM on March 28, 2007

Just to be sure, ie thinks that e.options is a meaningful statement? e.selectedIndex is meaningful?

Because I have some broadly similar code that works. We know the Id in my case, and you don't. That's why I keep asking if ie has really found the element in question.
posted by mrbugsentry at 3:44 PM on March 28, 2007

Are you 100% sure that there's only one element with the given name on the named form? The only thing left I can think of is that there's more than one element with that name, so you're not finding the right one.
posted by cerebus19 at 5:27 PM on March 28, 2007