By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
432,523 Members | 1,938 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 432,523 IT Pros & Developers. It's quick & easy.

Accessing javascript-generated textboxes with ASP.NET

P: n/a
I'm designing a form where the user can decide how many options for a
poll he wants to add. There's a "+" button to dynamically add
textboxes with javascript, without a postback.

How do I access these newly generated <input type="text" id="..." />
elements with ASP.NET to save it to a database?
Jun 27 '08 #1
Share this Question
Share on Google+
3 Replies


P: n/a
<je**********@gmail.comwrote in message
news:de**********************************@m3g2000h sc.googlegroups.com...
I'm designing a form where the user can decide how many options for a
poll he wants to add. There's a "+" button to dynamically add
textboxes with javascript, without a postback.

How do I access these newly generated <input type="text" id="..." />
elements with ASP.NET to save it to a database?
In a nutshell, you can't - at least, not in the normal way, because the
postback process only knows about controls which were created before the
page was rendered to the browser...

Fortunately, there's a fairly simple workaround. The following assumes
you're initiating the postback by means of an <asp:Button /webcontrol...

1) Add a hidden textbox to your page e.g.
<asp:HiddenField ID="MyHiddenField" runat="server" />
http://msdn.microsoft.com/en-us/libr...ddenfield.aspx

2) Add a client-side function to the <asp:Button /e.g.
<asp:Button ID="MyButton" runat="server" Value="Submit"
OnClick="MyButton_Click" OnClientClick="getTextBoxes();" />

3) Create the client-side JavaScript function getTextBoxes() e.g.

<script type="text/javascript">
function getTextBoxes()
{

}
</script>

4) Add code to the above function to walk through the dynamic textboxes,
adding their id and value to the value of MyHiddenField so that it ends up
looking like e.g.

"txt001=First value;txt002=Second value;txt003=Third value;"

etc

5) When the page is posted back, split the value of MyHiddenField on the
semi-colon character. This will give you a string array something like:

txt001=First value
txt002=Second value
txt003=Third value

Iterate through each element of the string array and split it on the equals
character - that will give you the ID of each dynamic textbox and its value.
--
Mark Rae
ASP.NET MVP
http://www.markrae.net

Jun 27 '08 #2

P: n/a
pretty trival.

the javascript textbox postback values will be in the Request.Form
collection. the collection key will be the name the javascript gave as the
name of the <input>. if the names is the same for all the controls, the value
will be a comma seperated string of each value. more common is to append a
counter to the end of the same.

it would also be pretty trival to make a server control that dynamically
created a asp:textbox for each of the postback values, and exposed them as
controls. or the control could expose a collection of values.

-- bruce (sqlwork.com)
"je**********@gmail.com" wrote:
I'm designing a form where the user can decide how many options for a
poll he wants to add. There's a "+" button to dynamically add
textboxes with javascript, without a postback.

How do I access these newly generated <input type="text" id="..." />
elements with ASP.NET to save it to a database?
Jun 27 '08 #3

P: n/a
Thank you very much It worked...
"Sandesh Daddi" wrote:
>

You can use following code to get it work
<%@ Page Language="C#" AutoEventWireup="true"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>

<script type="text/javascript" >

function createTextBox(event)
{

//Get the reference of DIV where we want to show textboxes
var dv = document.getElementById("dvTextBoxes");

//Create the Textbox and append that to DIV.
var tx = document.createElement("INPUT");
tx.name = "txt";
tx.value= "1";
dv.appendChild(tx);
}
</script>
<script type="text/C#" runat="server" >

protected void Page_Load(object sender, EventArgs e)
{
try
{
if (Page.IsPostBack)
{
String strValues = Request.Form["txt"];

String[] strV = strValues.Split(',');

for (int i = 0; i < strV.Length; i++)
{
lblError.Text += strV[i].ToString() + "\n";
}
}
}
catch (Exception ex)
{
throw ex;
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" id="btnAddText" value="Add text" onclick="createTextBox(event)" />
<div id="dvTextBoxes">
</div>
<asp:Button ID="btnSubmit" runat="server" Text="Submit"/>

<asp:Label ID="lblError" runat="server" ForeColor="RED" ></asp:Label>
</div>
</form>
</body>
</html>
Reply me if you want some thing else
Thank you
Saandesh Daddi
www.sanshark.com

Aug 26 '08 #4

This discussion thread is closed

Replies have been disabled for this discussion.