Using (static)HTML Controls in Code-Behind, Coding with C#/ASP.NET

Question

I am working in VS10 using C# in ASP.NET. In my design form, I have a textArea(standard HTML control).

 <textarea id="Text1"  rows = "8"; cols="30" onkeyup="AutoGrowTextArea(this)"   name="S1"> </textarea>

Now in my code-behind page, I am using C# to code the controls. I have given the textArea an auto-expand functionality which I require thru out my project. I need this TextArea as a server control, like when we put a textBox in the design page, we can use it in the code-behind page to code, since it is a server control. However, textArea isn't a server control. I have gone thru the previous posts on the site but i did not get anything enough useful. I have even tried using [<% %>] system, and [runat="server"] but it did not help. What i wanna do is to use the textArea in the Code-behind page, i.e. call it in the coding space, just like we can call the TextBox control objects. So, can anyone please help me with this,,, Regards.. javascript for autogrowing text box is:

  <script type="text/javascript"> 

function AutoGrowTextArea(textField)

{

if (textField.clientHeight < textField.scrollHeight) 

{

 textField.style.height = textField.scrollHeight + "px";

 if (textField.clientHeight < textField.scrollHeight)

{

textField.style.height = (textField.scrollHeight * 2 - textField.clientHeight) + "px";

} 

}

} 

</script>      

Answer 1

Try this

add runat="server" to the tag

<textarea id="Text1" runat="server"  rows = "8" cols="30" onkeyup="AutoGrowTextArea(this)" name="S1"> </textarea>

Answer 2

you can manipulate raw html controls setting the runat="server" propery of the control.

 <textarea id="Text1" runat="server"  rows = "8"; cols="30" onkeyup="AutoGrowTextArea(this)"   name="S1"> </textarea>

Answer 3

You can add runat="server" in your markup and it will be a server control.

You can also create server controls in your code behind. Declaration (In Visual Basic):

Protected WithEvents foo As Global.System.Web.UI.HtmlControls.HtmlGenericControl = Global.System.Web.UI.HtmlControls.HtmlGenericControl("textarea")

If you want to use something in all your project, you can declare a class inherited from Control or HtmlGenericControl and you can implement whatever you need to implement everywhere where you your new control.

Answer 4

<asp:TextBox id="thisIsMyTextBox" runat="server" multiline="true" width="200px" onkeyup="AutoGrowTextArea(this)" height="80px" style="resize:none;"></asp:TextBox>

You can play with the width/height as you wish !

function AutoGrowTextArea(textField)

{

   if(textField.Lenght()%50==0)//50 is the number of character in your textbox

   {

            if (textField.clientHeight < textField.scrollHeight) 

            {

                    textField.style.height = textField.scrollHeight + "px";

                    if (textField.clientHeight < textField.scrollHeight)

                    {

                             textField.style.height = (textField.scrollHeight * 2 - textField.clientHeight) + "px";

                    } 

     }

}