JavaScript Dynamic Adding of elements

Question

Please look at the following code

mydiv1.innerHTML=mydiv1.innerHTML + '<label>*Functional Area:<span class="small">Enter Company Name</span></label><input type="text" name="FunctionalArea_"'+counter1+' id="company" /><label class="spacing">*Experience:<span class="small">Number of years</span></label><select name="Exp_In_FA_"'+ counter1 +' id="experience"><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>morethan 5</option</select><input type="button" value="Add" id="bt1" onclick="generate()" style="font-size:8pt;height:25px;width:55px"/>'

Now the above javascript code is called properly and new elements get embedded at the desired location. But the problem is that when these values are passed to servlet, i am unable to retrieve Exp_In_FA_0 by using request.getParameter("Exp_In_FA_0"). It simply returns NULL. Please correct me where i am doing wrong? Sorry that i am unable to post the code in multiple lines. The code tag takes everything in single line only

What servlet and what request? Please provide more context. Also you could split up the code block manually, you'd just have to indent every line — Pekka
– Pekka, Commented Mar 8, 2011 at 9:59
name="FunctionalArea_"'+counter1+' should be name="FunctionalArea_'+counter1+'" — user69820
– user69820, Commented Mar 8, 2011 at 9:59
@ oracle certified professional: Could u please post the entire line..I am confused where to change waht? — nikhil
– nikhil, Commented Mar 8, 2011 at 10:02

Nivas · Accepted Answer · 2011-03-08 10:08:15Z

1

Try using Firebug (or similar tools) to see the actual genearted code (using the "Inspect Element") feature.

You might want to confirm the name, the form in which the element is added etc.

answered Mar 8, 2011 at 10:08

Nivas

18.4k4 gold badges65 silver badges76 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 09:58:31Z

0

Have a read here https://stackoverflow.com/search?q=innerhtml+form+not+passed

and

http://domscripting.com/blog/display/99

First of all, use the DOM to create a block level element—such as a div—using createElement. Then update the innerHTML property of this newly-created element. Finally, insert the updated element into the document using a DOM method like appendChild or insertBefore:

var newdiv = document.createElement("div");
newdiv.innerHTML = xhr.responseText;
var container = document.getElementById("container");
container.appendChild(newdiv);

edited May 23, 2017 at 9:58

CommunityBot

11 silver badge

answered Mar 8, 2011 at 10:07

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Comments

vbence · Accepted Answer · 2011-03-08 10:12:57Z

0

[...] new elements get embedded at the desired location.

Check whether the name attribute of the new element laso OK in the resulting HTML document. You can do this in Firefox with selecting your input box and the surrounding HTML and from the context menu choosing "Yiew source of selection". - Or you can use Google Chrome's "Inspect" feature to watch the element.

edited Mar 8, 2011 at 10:12

answered Mar 8, 2011 at 10:04

vbence

20.4k10 gold badges74 silver badges119 bronze badges

2 Comments

Nivas Over a year ago

View selection source might not work correctly if the elements are dynamically geneated via Javascript.

vbence Over a year ago

@Nivas Thnaks. Added Chrome option too.

Collectives™ on Stack Overflow

JavaScript Dynamic Adding of elements

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related