Dynamically Created Form Elements Not Recognized by Request.Form

[buck1107]

Hi,
I'm working with a form that has both static and dynamic form elements (add textbox, etc), and while I can access the static elements via request.form, the dynamic elements cannot be accessed. I have the dynamic elements appended within a div that lies within a table. Could this be a possible problem?
Thanks for any help or resources.

----------
Code below:
Here is the javascript:

 
function add3<%=strGoalCount%><%=strObjCount%>() {
 
 var foo = document.getElementById('fooBar<%=strGoalCount%><%=strObjCount%>');
 
 var numi = document.getElementById('theValue');
 var num = (document.getElementById('theValue').value -1)+ 2;
 numi.value = num;
 var newdiv = document.createElement('div');
 var divIdName = 'my'+num+'Div';
 newdiv.setAttribute('id',divIdName); 
 newdiv.style.backgroundColor="#FFCC80"; 
 newdiv.innerHTML = "<INPUT type=\"button\" value=\"Remove New Objective Box\" onclick=\"remove3<%=strGoalCount%><%=strObjCount%>(\'"+divIdName+"\')\"/>";
 

 var strObj_GUID = '<%=GetGuid()%>';
 var strGoal_GUID = '<%=strGoal_GUID%>';
 var strGoalNum = '<%=strGoalNum%>';

 
 var strObjDesc_Complete = 'ObjCol_ObjDesc_js_'+strObj_GUID;
 var strObjNum_Complete = 'ObjCol_ObjNum_js_'+strObj_GUID;
 

 //Create TextArea
 var element = document.createElement("textarea");

 //Assign attributes to the TextArea
 element.setAttribute("name", strObjDesc_Complete); 
 element.setAttribute("id", strObjDesc_Complete);

 //Create a Select Box 
 var selectBox = document.createElement("Select"); 
 selectBox.name=strObjNum_Complete;
 selectBox.id=strObjNum_Complete; 
 
 //Select Box - Creating first Option - loop through alphabet for option list
 var charCodeRange = 
 {
 start: 65,
 end: 90
 }
 for (var cc = charCodeRange.start; cc <= charCodeRange.end; cc++)
 {
 var option1 = document.createElement("OPTION"); 

 option1.text=String.fromCharCode(cc);
 option1.text=option1.text.toLowerCase(cc);
 option1.value=String.fromCharCode(cc);
 option1.value=option1.value.toLowerCase(cc);
 selectBox.options.add(option1);
 }

 var txtDescr1 = document.createTextNode("E.S1.");
 var txtGoal1 = document.createTextNode('<%=strGoalNum%>');
 var txtBrk1 = document.createElement('br');
 var txtBrk2 = document.createElement('br');
 var txtBrk3 = document.createElement('br');
 
 //Append the element in page (in span).
 newdiv.appendChild(txtBrk1);
 newdiv.appendChild(txtDescr1);
 newdiv.appendChild(txtGoal1);
 newdiv.appendChild(selectBox); 
 newdiv.appendChild(txtBrk2);
 newdiv.appendChild(element); 
 newdiv.appendChild(txtBrk3);
 
 
 
 foo.appendChild(newdiv);
 }
 

This is the code that runs at post back:

<%
 for each x in Request.Form 
 Response.Write("<br>" & x & " = " & Request.Form(x)) 
 next 
 %>

Here is the code at 'form level':

<input type="hidden" value="0" name="theValue" id="theValue" />
  <INPUT type="button" value="Add New Objective Box" onclick="add3<%=strGoalCount%><%=strObjCount%>()"/>
  <br />
  <div id="fooBar<%=strGoalCount%><%=strObjCount%>">&nbsp;</div>

[Fotiman]

It might help to see the actual HTML and JavaScript output, rather than the ASP code that generates it.

Also, where are your opening and closing <form></form> tags?