jQuery widget for string list input. This is useful for input
/textarea
html tags that are supposed to store a list of strings where the order is important. Thus, it uses jqueryui-sortable to allow reordering of the list.
Using Bower:
bower install jquery-string-list-input
Using NPM:
npm install jquery-string-list-input
Or simply copy jquery-string-list-input.css and jquery-string-list-input.js files to your project.
$('#textarea[data-provide="string-list-input"]').stringListInput({
});
$('#textarea[data-provide="string-list-input"]').stringListInput({
addText: 'I want to add a text',
labelText: 'My custom text',
removeText: 'I want to delete this text',
});
$('#textarea[data-provide="string-list-input"]').stringListInput({
suggestions: ['apple', 'facebook', 'google', 'amazon'],
});
$('#textarea[data-provide="string-list-input"]').stringListInput({
onUpdate: function(items) {
alert(JSON.stringify(items));
}
});
Option | Default | Mandatory | Description |
---|---|---|---|
addText | 'Add' | No | Display text on Add button |
cursor | 'move' | No | cursor option for jquery-ui sortable |
distance | 5 | No | distance option for jquery-ui sortable |
hide | true | No | Hide original input |
labelText | 'Expression' | No | Display text above each generated input |
opacity | .5 | No | opacity option for jquery-ui sortable |
removeText | 'Delete' | No | Display text on delete buttons |
suggestions | [] | No | Suggestions in each input generated. Requires jquery-textcomplete |
Option | Default | Mandatory | Description |
---|---|---|---|
onUpdate | undefined | No | Triggered every time the input is updated. |
- jquery (Tested with v2.1.4)
- jquery-ui (Tested with v1.10.4)
- jquery-textcomplete (optional)
Please see LICENSE for licensing details.