Resize readonly textbox

Question

1.00/5 (1 vote)

See more:

Hello,

I having a textbox on .ascx page. textbox is field at the time of pageload. textbox is readonly. now I want size of textbox as per the text in it. how to do this?

I use following java script:

<script type="text/javascript">
function setHeight(txtdesc) {
txtdesc.style.height = txtdesc.scrollHeight + "px";
}
</script>

for this following textbox

ASP.NET

<asp:TextBox ID="suggText" runat="server" OnTextChanged="setHeight(this)" CommandArgument="<%#Container.DataItemIndex %>"  Text='<%# DataBinder.Eval(Container.DataItem,"suggetion") %>' Font-Size="Smaller" TextMode="MultiLine" Enabled="False"   OnCommand="txtSuggestion_Command" Height="20px" ReadOnly="True"></asp:TextBox>

but it gives error that

C#

'ASP.controls_suggestions_ascx' does not contain a definition for 'setHeight' and no extension method 'setHeight' accepting a first argument of type 'ASP.controls_suggestions_ascx' could be found (are you missing a using directive or an assembly reference?)

please help

What I have tried:

I use following java script:

<script type="text/javascript">
function setHeight(txtdesc) {
txtdesc.style.height = txtdesc.scrollHeight + "px";
}
</script>

for this following textbox

ASP.NET

<asp:TextBox ID="suggText" runat="server" OnTextChanged="setHeight(this)" CommandArgument="<%#Container.DataItemIndex %>"  Text='<%# DataBinder.Eval(Container.DataItem,"suggetion") %>' Font-Size="Smaller" TextMode="MultiLine" Enabled="False"   OnCommand="txtSuggestion_Command" Height="20px" ReadOnly="True"></asp:TextBox>

but it gives error that

C#

'ASP.controls_suggestions_ascx' does not contain a definition for 'setHeight' and no extension method 'setHeight' accepting a first argument of type 'ASP.controls_suggestions_ascx' could be found (are you missing a using directive or an assembly reference?)

please help

Posted 12-Apr-16 4:54am

Kishor-KW

Updated 12-Apr-16 6:19am

Add a Solution

Comments

CHill60 12-Apr-16 11:24am

It might be a silly question but did you put your javascript function setHeight in controls_suggestions.ascx ?

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Richard Deeming · Answer 1 · 2016-04-12T06:19:00

Solution 1

You're trying to call a client-side method (setHeight) from a server-side event (TextChanged). Either use the onchange attribute:

ASP.NET

<asp:TextBox ID="suggText" runat="server" onchange="setHeight(this)" ...

or wire the event-handler up from Javascript:

JavaScript

var element = document.querySelector("textarea[name$=suggText]");
element.addEventListener("change", function(){
    setHeight(this);
});

Posted 12-Apr-16 6:19am

Richard Deeming

Comments

Kishor-KW 12-Apr-16 14:07pm

NO,textbox size is not changed or adjust as per contain in it. but using onchange event error is not occurring. still my goal is not hit

Richard Deeming 12-Apr-16 14:09pm

Well that event is only going to fire when the content of the textbox changes on the client. Since you've set the textbox to be disabled, the content will never change, so the event will never fire.

You need to call your setHeight method in the body's load event instead.

Kishor-KW 12-Apr-16 14:11pm

yes u r r8. is there any event to do this. Thank you for reply :)

Richard Deeming 12-Apr-16 14:16pm

body.addEventListener("load", function(){
   var element = document.querySelector("textarea[name$=suggText]");
   setHeight(element);
});

That should work in modern browsers. If you need to support old browsers - particularly old version of IE - then you'll need to modify it, or use a library like jQuery[^].