ASP.NET

how to dynamically set the text of a label using the text from textbox?

Please support our ASP.NET advertiser: 50% off 6 Months Dedicated Server Hosting from 1&1!

Thread Solved

•

Join Date: Aug 2009

Posts: 9

Reputation: maybach_hp is an unknown quantity at this point

Solved Threads: 0

maybach_hp maybach_hp is offline

Offline

Newbie Poster

how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

Hello,

I am newb to c# and I am working on an example. The challenge is to dynamically set the text of the label using the textboxes' text.

- There are 3 textboxes and a label. All are asp controls.
- The text should be displayed in the label as you type in the textbox and should hold the information of that particular text box when the user goes to another textbox.
- The user enters another string in the 2nd textbox which should add up to the label.
- If the user deletes the text of a textbox that should again remove the text from the label.

Please let me know how to do this with code or an idea.

I found something on internet like label.innerHTML can do this but I am not able to do it.

Thanks in advance!

•

Join Date: Jul 2009

Posts: 977

Reputation: DdoubleD is a jewel in the rough

Solved Threads: 224

DdoubleD

Offline

Posting Shark

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

Does this label1.Text need to be updated after each key stroke in the TextBox, or can it be updated after user has finished editing?

•

Join Date: Aug 2009

Posts: 9

Reputation: maybach_hp is an unknown quantity at this point

Solved Threads: 0

maybach_hp maybach_hp is offline

Offline

Newbie Poster

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

It has to be updated for each key stroke. Like we type in the textbox and the letters start appearing in the label.

Thanks!

•

Join Date: Jul 2009

Posts: 977

Reputation: DdoubleD is a jewel in the rough

Solved Threads: 224

DdoubleD

Offline

Posting Shark

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

Note the attributes for the TextBox:
onblur: control losing focus
onkeyup: after each keystroke

The value "UpdateLabel();" tells it to run that script upon those events.

 Help with Code Tags 
 ASP.NET Syntax (Toggle Plain Text) 
<head runat="server">
    <title></title>
</head>
<script type="text/javascript">
function UpdateLabel()
{
document.getElementById('Label1').innerText = document.getElementById('TextBox1').value;
}
</script>
<body>
    <form id="form1" runat="server">
    <div style="height: 83px">
			<br />
			<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
			<asp:TextBox ID="TextBox1" runat="server" onblur="UpdateLabel();" onkeyup="UpdateLabel();">
			  </asp:TextBox>
    </div>
    </form>
</body>
<head runat="server">
    <title></title>
</head>
<script type="text/javascript">
function UpdateLabel()
{
document.getElementById('Label1').innerText = document.getElementById('TextBox1').value;
}
</script>
<body>
    <form id="form1" runat="server">
    <div style="height: 83px">
			<br />
			<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
			<asp:TextBox ID="TextBox1" runat="server" onblur="UpdateLabel();" onkeyup="UpdateLabel();">
			  </asp:TextBox>
    </div>
    </form>
</body>

•

Join Date: Aug 2009

Posts: 9

Reputation: maybach_hp is an unknown quantity at this point

Solved Threads: 0

maybach_hp maybach_hp is offline

Offline

Newbie Poster

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

Thankyou very much. It works like charm!
But this works with one text box. How can I do with 3 textboxes?

•

Join Date: Jul 2009

Posts: 977

Reputation: DdoubleD is a jewel in the rough

Solved Threads: 224

DdoubleD

Offline

Posting Shark

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

I thought I sent this a few minutes ago, but I guess not. Here is another way to do it in the asp form's page load and without the Java function:

 Help with Code Tags 
 ASP.NET Syntax (Toggle Plain Text) 
        protected void Page_Load(object sender, EventArgs e)
        {
            String scriptText = "";
            scriptText += "function UpdateLabel2(){";
            scriptText += "   Label1.innerText = " +
                " document.forms[0].TextBox1.value";
            scriptText += "}";
            this.ClientScript.RegisterClientScriptBlock(this.GetType(),
               "OnKeyUpScript", scriptText, true);
            TextBox1.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox1.Attributes.Add("onblur", "UpdateLabel2()");
        }
        protected void Page_Load(object sender, EventArgs e)
        {
            String scriptText = "";
            scriptText += "function UpdateLabel2(){";
            scriptText += "   Label1.innerText = " +
                " document.forms[0].TextBox1.value";
            scriptText += "}";
            this.ClientScript.RegisterClientScriptBlock(this.GetType(),
               "OnKeyUpScript", scriptText, true);
            TextBox1.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox1.Attributes.Add("onblur", "UpdateLabel2()");
        }

•

Join Date: Jul 2009

Posts: 977

Reputation: DdoubleD is a jewel in the rough

Solved Threads: 224

DdoubleD

Offline

Posting Shark

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

•

Originally Posted by maybach_hp

Thankyou very much. It works like charm!
But this works with one text box. How can I do with 3 textboxes?

OK. You need to concatenate all three textboxes into the one label?

•

Join Date: Aug 2009

Posts: 9

Reputation: maybach_hp is an unknown quantity at this point

Solved Threads: 0

maybach_hp maybach_hp is offline

Offline

Newbie Poster

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

Yes that's right. I have to concatenate the text from textboxes.

Like textbox1.text <space or symbol> textbox2.text and so on...

Last edited by maybach_hp; Aug 20th, 2009 at 2:00 pm.

•

Join Date: Jul 2009

Posts: 977

Reputation: DdoubleD is a jewel in the rough

Solved Threads: 224

DdoubleD

Offline

Posting Shark

Re: how to dynamically set the text of a label using the text from textbox?

Aug 20th, 2009

You can just modify the function to concatenate the values and call it to process keyup events for all three textboxes:

 Help with Code Tags 
 ASP.NET Syntax (Toggle Plain Text) 
        protected void Page_Load(object sender, EventArgs e)
        {
            String scriptText = "";
            scriptText += "function UpdateLabel2(){";
            scriptText += "   Label1.innerText = " +
                " document.forms[0].TextBox1.value + ',' + " + 
                " document.forms[0].TextBox2.value + ',' + " +
                " document.forms[0].TextBox3.value";
            scriptText += "}";
            this.ClientScript.RegisterClientScriptBlock(this.GetType(),
               "OnKeyUpScript", scriptText, true);
            TextBox1.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox1.Attributes.Add("onblur", "UpdateLabel2()");
            TextBox2.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox2.Attributes.Add("onblur", "UpdateLabel2()");
            TextBox3.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox3.Attributes.Add("onblur", "UpdateLabel2()");
        }
        protected void Page_Load(object sender, EventArgs e)
        {
            String scriptText = "";
            scriptText += "function UpdateLabel2(){";
            scriptText += "   Label1.innerText = " +
                " document.forms[0].TextBox1.value + ',' + " + 
                " document.forms[0].TextBox2.value + ',' + " +
                " document.forms[0].TextBox3.value";
            scriptText += "}";
            this.ClientScript.RegisterClientScriptBlock(this.GetType(),
               "OnKeyUpScript", scriptText, true);
            TextBox1.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox1.Attributes.Add("onblur", "UpdateLabel2()");
            TextBox2.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox2.Attributes.Add("onblur", "UpdateLabel2()");
            TextBox3.Attributes.Add("onkeyup", "UpdateLabel2()");
            TextBox3.Attributes.Add("onblur", "UpdateLabel2()");
        }

•

Join Date: Aug 2009

Posts: 9

Reputation: maybach_hp is an unknown quantity at this point

Solved Threads: 0

maybach_hp maybach_hp is offline

Offline

Newbie Poster

Re: how to dynamically set the text of a label using the text from textbox?

#10

Aug 20th, 2009

Brilliant! I was actually working like that. But now the problem is when the user deletes the text in the textbox the ',' should also go right?

How to remove that?