JavaScript HTML
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.


NPM Version NPM Downloads Buy Me a Coffee

Input-Autogrow is a plugin for autogrowing inputs. This plugin is different from others because most usually target textarea tags, this library is instead targeted at input tags.

Requires a DOM library such as jQuery, Zepto, or any that supports $.fn plugins.



NPM, Yarn, or Bower

npm install input-autogrow

yarn add input-autogrow

bower install input-autogrow

Rails Install

# Gemfile
source '' do
  gem 'rails-assets-input-autogrow'

# app/assets/javascripts/application.js
 *= require input-autogrow


/* Makes input elements autogrow */

/* Manually trigger update */
/* or */

/* Custom Options */
$('input.autogrow').inputAutogrow({maxWidth: 500, minWidth: 25, trailingSpace: 10});

/* Remove autogrow from input */

/* If the parent container width is changed (and maxWidth is not specified)
   OR the options need to be changed, then you must destroy & re-initialize inputAutogrow */


maxWidth - The max width of the autogrow - Defaults to the inputs parent width

minWidth - The min width of the autogrow - Defaults to the inputs original input start width

trailingSpace - This is extra spacing at the end of the input which is used until the maxWidth is hit - Default: 0


  • Only edit js files from src/ and test/ folders.
  • To run tests: npm run test
  • Remember to run gulp to run the dist build after your done adding and testing your changes.


Created & Maintained by Weston Ganger - @westonganger

Originally based on this Stackoverflow answer by James Padolsey

For any consulting or contract work please contact me via my company website: Solid Foundation Web Development