Allow client to input key-values pairs for some operations like interactive searching, raw-json etc.
- Interactive and better usability
- Can set up domain keys, means user can input values only for restrictive keys
- Allow parsing as Number, Boolean etc
- Allow user to input custom string for value
http://jsfiddle.net/codeofnode/w2v1az8q/19/
- JQuery
- Select2
bower install key-value
<input type="hidden"></input>
<!-- the element on which select2 will be called -->
var DOMAIN = { // You have to provide non-empty domain object, client can input any of for keys pool, alpha, casing or symbols, in this case.
pool : { userInput : true, userInputMsg : 'Type your characters and press space' }, // for allow user to input his own value use `userInput` : true
alpha : { parse : 'Boolean', data : ['true','false'] }, // `parse` tells how to compile, parse string to boolean in this case
casing : { data : ['upper','lower'] },// `data` tells the list of available values for corresponding key
symbols : { name : 'isSymbolAllowed', parse : 'Boolean', data : ['true','false'] } // put `name` if you want to display user readable key
};
var kv = new KV($('input'),DOMAIN); // where KV is result on requiring `key-value`
//...
//...
//...
//...
var currentValue = kv.get(); // To extract the current object of key-value pairs
- To support select2 v4
- Trigger custom events whenever a key-value pair added or removed
Found anything difficult to understand? or some bug or some improvement?. Create an issue issue for the same.
Key Value Inputer is released under the MIT license: