Authors:Benjamin Santalucia
Developers:Benjamin Santalucia

The ListInput widget allow you to create a list of element. It’s like the “to” field on hotmail.


The ListInput widget is a new way for letting user to create a list.

The list is populated by an input. The data written in the field is added to the list when : onblur, enter key pressed, or by adding a separator in the input(like comma).

Data can be validated by a regular expression before the adding. When page is submitted, you can choose to post all the data or just the valid items.

The left and right arrows are used to re-edit an entry.


Declarative example

<div data-dojo-type="dojox.form.ListInput" id="fruit" data-dojo-props="name:'fruit', value:['Apples','Oranges','Pears']"></div>
@import "{{baseUrl}}dojox/form/resources/ListInput.css";

Programmatic example

    var sel = dojo.byId('dynamic');
    var n = 0;
    var value = "";
    for(var i in dijit){
            value += i + ",";
    new dojox.form.ListInput({
        name: 'dynamic',
        value: "Apples,Oranges,Pears"
    }, sel);
<div id="dynamic"></div>
<p><button onClick="alert(dijit.byId('dynamic').get('value'))">Get value</button></p>
@import "{{baseUrl}}dojox/form/resources/ListInput.css";
Error in the documentation? Can’t find what you are looking for? Let us know!