Cross Browser Problem - IE can not find a dynamic form

jaxent

Does anyone know why IE gives the error "'document.myFo rm.dummy' is
null or not an object" on the following page? Firefox does what I
expect, creates a text box and writes "hello" in it.

<html>
<head>
<SCRIPT type="text/javascript"/">
function createForm(){

var divEle = document.getEle mentById("putHe re");
var formEle = document.create Element("form") ;
formEle.setAttr ibute("name", "myForm");
formEle.setAttr ibute("method", "post");
formEle.setAttr ibute("action", "page.jsp") ;
divEle.appendCh ild(formEle);

var dummyEle = document.create Element("input" );
dummyEle.setAtt ribute("type", "text");
dummyEle.setAtt ribute("name", "dummy");
formEle.appendC hild(dummyEle);

}
</script>
</head>
<body>
<div id="putHere"></div>
<script type="text/javascript">
createForm();
document.myForm .dummy.value = "hello";
</script>
</body>
</html>

Apr 19 '06 #1

Subscribe Reply

3258

jaxent

BTW: It works if the form is not dynamicly created.

<html>
<head>
</head>
<body>
<form name="myForm">
<input type="text" name="dummy">
</form>
<script type="text/javascript">
document.myForm .dummy.value="h ello";
</script>
</body>
</html>

Apr 19 '06 #2

Matt Kruse

ja****@gmail.co m wrote:

Does anyone know why IE gives the error "'document.myFo rm.dummy' is
null or not an object" on the following page?

I've never investigated far enough to figure out the real root cause of this
problem in IE. But IE definitely does have problems accessing
dynamically-created inputs by name. Also, see the example below, which
illustrates that changing an input's name doesn't make it available under
the new name, but it is still available under the old name:

<form action="/">
<input name="test">
</form>
<script type="text/javascript">
var i = document.forms[0].elements['test'];
alert(i);
i.name = "junk";
alert(i.name);
alert(document. forms[0].elements['junk']);
alert(document. forms[0].elements['test']);
</script>

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

Apr 19 '06 #3

RobG

ja****@gmail.co m said on 19/04/2006 10:47 AM AEST:

Does anyone know why IE gives the error "'document.myFo rm.dummy' is
null or not an object" on the following page? Firefox does what I
expect, creates a text box and writes "hello" in it.
Because IE is broken, it doesn't let you add a name attribute to a
dynamically generated form for some absurd reason. See below.

<html>
<head>
<SCRIPT type="text/javascript"/"> --------------------------------^^

An HTML markup error that doesn't seem to affect the outcome.

function createForm(){

var divEle = document.getEle mentById("putHe re");
var formEle = document.create Element("form") ;
formEle.setAttr ibute("name", "myForm");

You can add an ID, then use the fully specified property name:

alert( typeof document.forms['myForm'] );
Same for the input element.

Rather than setAttribute, which is broken in IE for some situations,
access properties directly (non-standard but better supported):

formEle.name = "myForm";
formEle.id = "myForm";

...

dummyEle.name = "dummy";
dummyEle.id = "dummy";
Saves on typing too. :-)

Now you put the value into the input using:

document.forms['myForm'].elements['dummy'].value = "hello";
[...]
--
Rob
Group FAQ: <URL:http://www.jibbering.c om/FAQ>

Apr 19 '06 #4

Jim

Hi,
Can't answer your exact question as to "why does ie do this?" but can
offer a resolution to the problem. IE does not reference the form by
name, but it will reference it thusly:
document.forms[0].elements[0].value = "blah";

Also, I had a different way of adding attribute values to the newly
created elements.
Here's my version:

function createForm(){
var target_div= document.getEle mentById("putHe re");
var form = document.create Element("form") ;
form.name="myfo rm";
form.method="ge t";
form.action="ht tp://www.yahoo.com";
target_div.appe ndChild(form);

var input = document.create Element("input" );
input.type="tex t";
input.name="dum my";
form.appendChil d(input);

var submit = document.create Element("input" );
submit.type="su bmit";
submit.name="su bmit";
submit.value="S ubmit This Form";
form.appendChil d(submit);

var reset = document.create Element("input" );
reset.type="res et";
reset.name="res et";
reset.value="Re set This Form";
form.appendChil d(reset);
document.forms[0].elements[0].value="hi there";
}
</script>

Apr 19 '06 #5

RobG

Jim said on 19/04/2006 1:15 PM AEST:

[...]

var submit = document.create Element("input" );
submit.type="su bmit";
submit.name="su bmit";
Don't give a form control a name of 'submit' as it will mask the form's
submit method. About the only reason to give a button a name is if you
have multiple submit buttons. Otherwise, there is usually no reason to
give a button a name, so don't.

submit.value="S ubmit This Form";
form.appendChil d(submit);

var reset = document.create Element("input" );
reset.type="res et";
reset.name="res et";

Same for reset.

[...]

--
Rob
Group FAQ: <URL:http://www.jibbering.c om/FAQ>

Apr 19 '06 #6

RobG

Matt Kruse said on 19/04/2006 1:20 PM AEST:

ja****@gmail.co m wrote:
Does anyone know why IE gives the error "'document.myFo rm.dummy' is
null or not an object" on the following page?

I've never investigated far enough to figure out the real root cause of this
problem in IE. But IE definitely does have problems accessing
dynamically-created inputs by name. Also, see the example below, which
illustrates that changing an input's name doesn't make it available under
the new name, but it is still available under the old name:

From MSDN:

"The NAME attribute cannot be set at run time on elements
dynamically created with the createElement method. To create
an element with a name attribute, include the attribute and
value when using the createElement method."
<URL:http://msdn.microsoft. com/workshop/author/dhtml/reference/properties/name_2.asp>

Microsoft gives the following example of a createElement statement
(excuse wrapping):

var newRadioButton = document.create Element("<INPUT TYPE='RADIO'
NAME='RADIOTEST ' VALUE='First Choice'>")

<URL:http://msdn.microsoft. com/workshop/author/dhtml/reference/methods/createelement.a sp>
They reference the W3C DOM 1 createElement method, which infers that
Microsoft's is standards compliant. Opinions on that may vary ;-)

If you attempt to add or modify the name attribute of an element in IE
using script, you can look at the generated source using innerHTML and
see that it isn't added or modified.

You can add/modify the ID attribute, but then you can only access it
using strictly formal syntax:

document.forms[formName].elements[elementName];
or less strict:

document.forms. formName.elemen ts.elementName;
but not "loose":

document.formNa me.elementName;

--
Rob
Group FAQ: <URL:http://www.jibbering.c om/FAQ>

Apr 19 '06 #7

jaxent

Thanks for all the help!

They reference the W3C DOM 1 createElement method, which infers that Microsoft's is standards compliant. Opinions on that may vary ;-)

In another life I had to get into standards translation arguements
with Microsoft, now I only have to work around the fact they drink
decaf espresso (miss the point entirely). Pass in markup for it to be
parsed and then create an element, I guess that would must obvious way
to do it. :-)

Anyway, Firefox 1.0.7 chocks on that kin way of of calling
createElement. So here is a copy that works. Hope it helps somebody
else get passed this.

<html>
<head>
<SCRIPT type="text/javascript"/">
var isIE = false;
if (navigator.appN ame.match("Micr osoft*")){
isIE = true;
}

function createForm(){

var divEle = document.getEle mentById("putHe re");
var formEle = null;
if(isIE){
formEle = document.create Element("<form name='myForm'>" );
}else{
formEle = document.create Element("form") ;
formEle.name = "myForm"
}
formEle.method = "post";
formEle.action = "page.jsp";
divEle.appendCh ild(formEle);

var dummyEle = null
if(isIE){
dummyEle = document.create Element("<input name='dummy'>") ;
}else{
dummyEle = document.create Element("input" );
dummyEle.name = "dummy";
}
dummyEle.type = "text";
dummyEle.name = "dummy";
formEle.appendC hild(dummyEle);

}
</script>
</head>
<body>
<div id="putHere"></div>
<script type="text/javascript">
createForm();
document.myForm .dummy.value = "hello";
</script>
</body>
</html>

Apr 19 '06 #8

jaxent

Wow, I didn't think I worked that late. Late enough to fry the verbal
center of my brain I guess. Translation to real english follows:

Thanks for all the help!

They reference the W3C DOM 1 createElement method, which infers that Microsoft's is standards compliant. Opinions on that may vary ;-)

In another life I had to get into standards translation arguments
with Microsoft, now I only have to work around the fact they drink
decaf espresso (miss the point entirely). Pass in markup to be parsed
and then create an element, I guess that would be the most obvious way
to do it. :-)

Anyway, Firefox 1.0.7 chokes on that keen way of calling
createElement. So here is a copy that works. Hope this helps somebody
else get past this problem.

Apr 19 '06 #9

RobG

ja****@gmail.co m said on 19/04/2006 3:50 PM AEST:

Thanks for all the help!

They reference the W3C DOM 1 createElement method, which infers that Microsoft's is standards compliant. Opinions on that may vary ;-)

Pass in markup for it to be
parsed and then create an element, I guess that would must obvious way
to do it. :-)

Anyway, Firefox 1.0.7 chocks on that kin way of of calling
createElement. So here is a copy that works. Hope it helps somebody
else get passed this.

[...] <SCRIPT type="text/javascript"/">
var isIE = false;
if (navigator.appN ame.match("Micr osoft*")){
isIE = true;

I was about to admonish you for choosing the worst way to fix the
problem and suggest that you clone existing elements (say create dummy
elements specifically created for that purpose in the source HTML and
placed within a div with style=display:n one).

But guess what? You can't set or modify the name of a cloned element
either. Wonder if that will be fixed in IE 7?

Silly thing is, the name property is modified but only within the scope
of the function creating the element. As soon as the function ends, the
name reverts to whatever it was when the element was created/cloned.

I still think sniffing IE is a very bad idea, maybe you should test for
outerHTML and, if available, use that to set the name - otherwise just
set the property as usual.

[...]
--
Rob
Group FAQ: <URL:http://www.jibbering.c om/FAQ>

Apr 21 '06 #10

Similar topics

6628

Inhibiting Browser Back/Fwd Buttons via PHP?

by: Ralph Freshour | last post by:

Is it possible to inhibit the browser Back/Fwd buttons via PHP? Thanks...

PHP

5479

Cross-browser programming

by: Simba | last post by:

In some pages of my website I use a code like the following: for (var n = 0; n < getTagsArray("SPAN").length; n++){ //SPAN is just an example. I also use other tags tag = getTagsArray("SPAN"); //make something with tag... }

Javascript

5784

Looking for a cross browser general css stylesheet

by: HchC | last post by:

Not looking for a special or fancy css stylesheet. For a HTML beginner, stylesheet is still far away from now. Not even said thinking about cross browser. But, an XHTML page without stylesheet look ugly. SO, I am looking for a "cross browser" "general" stylesheet that can be apply to a general HTML page.

HTML / CSS

3692

Cross-browser DHTML/JS Excel-like "GRID"

by: Questman | last post by:

Good afternoon, Does anyone have any code that implements, or approaches implementing, a cross-browser DHTML/JS solution to provide an Excel-like Grid on a web page - I'm trying to convert an old Java client/server data maintenance program to the web - the main display is in a grid format, which allows the user to select multiple rows and edit them in a new grid, which processes each grid line individually and validates and saves the...

Javascript

2619

ASP.Net 2.0 vs. Safari Browser

by: Bill Cohagan | last post by:

I'm having some serious difficulties with my ASP.Net 2.0 app rendering in Safari 2.0.3. The most immediate problem is that the menu control doesn't seem to work at all, particularly the use of dynamic levels. I've Googled around a bit and determined that the problem is not so much with Safari as it is with ASP.Net inaccurately determining the browser capabilites for that browser. In the 2.0 Framework it appears that browser caps are...

ASP.NET

2329

Cross Browser?

by: CMM | last post by:

So I'm half way through overseeing a large project in ASP.NET 2.0. My superiors have decided that it would be nice if we ensured the site worked on all the major platforms (as they see it: IE, FireFox, and Safari). We've made heavy usage of the new MENU control and other intrinsic 2.0 controls.... nothing fancy! just using ASP.NET's built-in controls and very nice, pervasive, and clean usage of CSS. Now I find after more testing that the...

ASP.NET

1323

Cross-browser problem | XML pagging

by: kaddison01 | last post by:

Hello all! I'm new to the community and am looking for some help. I'm working on a project which consists of an HTML wrapper w/ a data island for xml. I have an xsl transformation and a javascript which creates the effect of paging. However, I'm having trouble creating a cross-browser html wrapper page. It works in IE but doesn't work in Firefox. I was wondering if anyone here could help me? I made some mockup files to illustrate the...

.NET Framework

9407

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...

Windows Server

10171

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

10015

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...

Online Marketing

9960

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

7384

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

5280

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

5425

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

3931

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp

2808

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General