Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Nov 2010
    Location
    Florida
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts

    How do you resize a textbox in javascript

    I have an asp.net textbox. I need to use javascript so that there are no postbacks. I would like to click the button and the textbox height kept increases each time the user clicks the button. So far I can toggle:

    function resize(){
    var textbox = $get('<%=txtWhoTo.ClientID %>');
    textbox.style.height = textbox.style.height == '56px' ? '23px' : '56px';
    }

    I would like to increase the height 56px each time the clicks the button.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,118
    Thanks
    80
    Thanked 4,554 Times in 4,518 Posts
    First of all, it's *NOT* a "textbox". ASP.NET calls it that, but when an ASP.NET "textbox" is more than one line high, it's a <TEXTAREA> as rendered in HTML.

    Anyway:
    Code:
    function resize()
    {
       var ta = $get('<%=txtWhoTo.ClientID %>');
       ta.style.height = ( parseInt(ta.style.height) + 56 ) + "px";
    }
    It's probably not a good idea to name the function "resize" as that's a builtin event on at least the <body> object. Not sure about other objects.

    If possible, just change the name. Even "Resize" (capitalize the first letter) would be better.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    bthumber (11-16-2010)

  • #3
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,444
    Thanks
    11
    Thanked 598 Times in 578 Posts
    Quote Originally Posted by Old Pedant View Post
    It's probably not a good idea to name the function "resize" as that's a builtin event on at least the <body> object. Not sure about other objects.
    no it's not, onresize is...
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • Users who have thanked rnd me for this post:

    bthumber (11-17-2010)

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,118
    Thanks
    80
    Thanked 4,554 Times in 4,518 Posts
    Yes, I know the event is named onresize, but you *can* invoke it via a call to resize().

    Maybe it's not important, not a big deal. Maybe it never causes conflicts. I'm just paranoid and avoid duplicating any built-in names I'm aware of.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    bthumber (11-16-2010)

  • #5
    New to the CF scene
    Join Date
    Nov 2010
    Location
    Florida
    Posts
    9
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Thanks for the help it works great! I changed the name of the function to something more discriptive IncreaseTBSize() and DecreaseTBSize. Now just for my knowledge you it is a testarea because it is more than one line, correct.

  • #6
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,444
    Thanks
    11
    Thanked 598 Times in 578 Posts
    Quote Originally Posted by Old Pedant View Post
    Maybe it's not important, not a big deal. Maybe it never causes conflicts. I'm just paranoid and avoid duplicating any built-in names I'm aware of.
    never a bad idea...
    my site (updated 2014/10/20)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.3, IE11:9.2, IE9:2.7, IE10:2.6, FF:16.8, CH:47.5, SF:7.8, NON-MOUSE:37%

  • Users who have thanked rnd me for this post:

    bthumber (11-17-2010)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •