SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Nov 2008
    Location
    UK
    Posts
    163
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Fixed size text box to limit user input

    What I'd like to do is have a fixed-size textarea that only allows as much input as will fit in the box (based on a fixed font size) without any scrolling or resizing. (number of characters will vary as using proportional font).

    I've tried all sorts of things including intercepting when a scroll bar appears, and trying to modify this jquery autosize plugin https://github.com/padolsey/jQuery.fn.autoResize#readme, but I can't get it to work properly.

    Can anyone suggest the best way to go about it, or is there already a plugin to do it?

    Thanks

  2. #2
    Non-Member Max Height's Avatar
    Join Date
    Dec 2011
    Posts
    303
    Mentioned
    6 Post(s)
    Tagged
    1 Thread(s)
    How are you fixing the font-size? I assume you are aware that users can over-ride in their browsers any css styles that you apply.

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by treacle0996 View Post
    Can anyone suggest the best way to go about it, or is there already a plugin to do it?
    A way to get started on this is to remove the scrollbar from the input element, and to then check if the keypress changes the size of the field.

    Code css:
    .fixed {
        overflow: hidden;
    }

    HTML Code:
    <textarea class="fixed"></textarea>
    Code javascript:
    $('textarea.fixed').keyup(function () {
        while (this.clientHeight < this.scrollHeight) {
            this.value = this.value.slice(0, -1);
        }
    });
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    SitePoint Zealot
    Join Date
    Nov 2008
    Location
    UK
    Posts
    163
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Paul

    Works perfectly - in all browsers so far..


Bookmarks

Posting Permissions

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