473,657 Members | 2,595 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Dynamic form fields added with appendChild or innerHTML do not POST on submit in Firefox

I spent several hours struggling with dynamic form fields added with
appendChild or innerHTML not POSTing on submit in Firefox. The only
way I found to make it work is to append any created fields to a DIV
within the form. Here is an example I store from another post. I hope
this helps someone.

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
<title>creati ng input elements dynamically</title>
<script type="text/javascript">
function addInput () {
var div;
if (document.getEl ementById) {
div = document.getEle mentById('hidde nList');
var input;
if (document.creat eElement && (input =
document.create Element('input' ))) {
input.type = 'hidden';
input.name = 'currentDate';
input.defaultVa lue = input.value = new Date().toString ();
div.appendChild (input);
}
}
}

function showQueryString () {
document.write( '<p>location.se arch: ' + location.search + '<\/p>\r
\n');
}

</script>

</head>
<body>
<script type="text/javascript">
showQueryString ();
</script>

<form name="form1" action="test.ph p">
<div id="hiddenList" ></div>

<input type="submit" onClick="addInp ut()">
</form>

</body>
</html>

May 23 '07 #1
1 6027
On May 24, 9:40 am, Derek Basch <dba...@yahoo.c omwrote:
I spent several hours struggling with dynamic form fields added with
appendChild or innerHTML not POSTing on submit in Firefox. The only
way I found to make it work is to append any created fields to a DIV
within the form. Here is an example I store from another post. I hope
this helps someone.
I don't know what your problem was since you didn't post the non-
working code, I suspect it was as a result of putting DOM-altering
code in an onclick handler on the submit button - use the form's
onsubmit event instead.

In any case, your code works fine even if you remove the div and
append the input to the form from the submit button's click event.
For the record, to be valid HTML a form must have a block element
inside it enclosing all the form controls, like:

<form ... >
<div>
<!-- the rest of the form -->
</div>
</form>
The div can be replaced with a p or table element, or any block
element.

<URL: http://www.w3.org/TR/html401/interac...html#edef-FORM >
[...]
<form name="form1" action="test.ph p">
<div id="hiddenList" ></div>

<input type="submit" onClick="addInp ut()">
It's not a good idea to combine a submit button with an onclick event,
use the form's onsubmit handler instead.
--
Rob

May 24 '07 #2

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
3149
by: daveland | last post by:
I am working on some JavaScript that dynamically adds rows to a table in response to a button click. A new row does appear on the screen when the button is clicked. However, that table to which a row has been added is itself contained within an outer table (to handle the desired screen layout). That outer table does not properly grow to contain the new size of the table to which the row was added. (More specifically, I have...
7
1939
by: pizzy | last post by:
PROBLEM: I CAN'T GET THE LAST RESUTS TO WORK CORRECTLY. I WOULD PROVIDE THE CODE (AND WILL IF REQUESTED). BUT IN MY OWN WORDS I AM TRYING TO HAVE THE FIRST FORM DYNAMICALLY CREATE INPUT BOXES BASED ON THE NUMBER ENTERED. THEN ON THE SECOND FORM (WHICH IS CREATED BY THE FIRST FORM CALLING A FUNCTION) I WANT THE USER TO BE ABLE TO CLICK ON ONE OF THE CHECKBOXES AND SEE MORE INPUT BOXES APPEAR. HAS ANYONE DONE SOMETHING LIKE THIS? IF SO,...
6
2827
by: hsomob1999 | last post by:
so i have a <ul> and I allow the user to append items to it. The problem is that on mozilla the <span class="line"> which is just a line to divide the sections gets overlaped and doesnt move down and adjust to the newly added items like it does in iE. It just occured to me that i dont really have to use a span, and a html <hr> tag could do the trick -I will go try. But aside from that could some one explain why this occurs? And will I get...
7
6760
by: JavaScriptRocks | last post by:
I've been trying to imitate / reverse engineer the add attachment feature in gmail composer. I managed to do it to say about 80% but its giving me trouble in IE on WinXP-Sp2. I am using PHP to do the upload. It works well on Firefox/DeerPark, but in IE, the file selected just vanishes. You can verify it by commenting the lines marked "//IE Trouble". Commenting those lines will remove IE specific code, except the el.click() whick sends the...
3
2129
by: IRAS Blues | last post by:
Hi all, I've got a form that consists of a bunch of textboxes and also file upload inputs. For both sets of fields, I need to be able to add in additional elements on the fly. This is done by an "Add Textbox" and "Add Upload Fields" button that I use Javascript to add to the fields. I use client-side Javascript only to add to the fields. The problem comes when I submit the form. When I submit the form, the files uploaded present no...
1
3073
by: bumpy | last post by:
I wrote this pretty slick DHTML table that lets you add/remove rows and show/hide columns on the fly. It works perfectly in IE7, but it doesn't behave in Firefox 2.0.0.4. You can see it in action here: http://www.phreelancer.com/dyn_table/ If you start to add/remove rows and then show/hide columns a few times in FF, you'll see that some table cells are bundled together or that some hidden cells don't get collapsed (but are still empty)....
0
3377
bmallett
by: bmallett | last post by:
First off, i would like to thank everyone for any and all help with this. That being said, I am having a problem retrieving/posting my dynamic form data. I have a form that has multiple options within options. I have everything being dynamically named from the previously dynamically named element. (I hope this makes sense.) I am not able to retrieve any of the dynamically created values. I can view them on the source page but can't pull them...
6
2888
by: azegurb | last post by:
Hello, I have one question again i created one table again and in this table i added some another options for ex at the previous table there were only one problem sum of the dynamically added rows in this beside sum i need to sum of the tax for ex: in column1 i added 300 and into 2-nd column i Chose 10% i would like when i chose from drop down box 10% Let in the 2-nd column appear 10% of the value which i addee first column for ex...
0
8392
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
8305
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,...
0
8823
Oralloy
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...
0
8730
jinu1996
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...
0
8605
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
7321
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6163
isladogs
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...
1
2726
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
2
1607
bsmnconsultancy
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...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.