https://github.com/gr2m/expandable-input
A Bootstrap plugin to use <{span|div|...} contenteditable> as auto-expanding inputs.
https://github.com/gr2m/expandable-input
Last synced: 7 months ago
JSON representation
A Bootstrap plugin to use <{span|div|...} contenteditable> as auto-expanding inputs.
- Host: GitHub
- URL: https://github.com/gr2m/expandable-input
- Owner: gr2m
- Created: 2014-02-06T19:24:11.000Z (over 12 years ago)
- Default Branch: master
- Last Pushed: 2021-03-05T06:40:31.000Z (over 5 years ago)
- Last Synced: 2025-06-14T04:24:24.213Z (about 1 year ago)
- Language: JavaScript
- Homepage: https://gr2m.github.io/expandable-input
- Size: 647 KB
- Stars: 10
- Watchers: 4
- Forks: 7
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# Expandable Input – A jQuery plugin
> A jQuery plugin to use <{span|div|...} contenteditable> as expandable inputs.
[](https://travis-ci.org/gr2m/expandable-input)
[](https://david-dm.org/gr2m/expandable-input)
[](https://david-dm.org/gr2m/expandable-input#info=devDependencies)
## Download / Installation
You can download the latest JS & CSS code here:
- https://unpkg.com/expandable-input/dist/expandable-input.js
- https://unpkg.com/expandable-input/dist/expandable-input.css
Or install via [npm](https://www.npmjs.com/)
```
npm install --save expandable-input
```
The JS code can be required with
```js
var jQuery = require('jquery')
var expandableInput = require('expandable-input')
// init
expandableInput(jQuery)
```
The CSS code lives at `node_modules/expandable-input/expandable-input.css`
## Usage
```html
Author:
|
```
To listen to changes on the inputs
```js
$('[name=email]').on('input', function(event) {
console.log('Current name is:', $(this).val())
})
```
## Notes
- `$.fn.val()` & `$.fn.select()` are being patched to work with the `contenteditable` inputs
- `display: inline` is currently not supported. It gets set to inline-block when initialized.
- no html5 validation or password=type etc is not supported.
## Local Setup
```bash
git clone git@github.com:gr2m/smartdate-input.git
cd smartdate-input
npm install
```
## Test
You can start a local dev server with
```bash
npm start
```
Run tests with
```bash
npm test
```
While working on the tests, you can start Selenium / Chrome driver
once, and then tests re-run on each save
```bash
npm run test:mocha:watch
```
## Fine Print
The Expandable Input Plugin have been authored by [Gregor Martynus](https://github.com/gr2m),
proud member of the [Hoodie Community](http://hood.ie/).
License: MIT