dojox.form.ListInput

Authors: Benjamin Santalucia
Developers:Benjamin Santalucia
since:1.4

The ListInput widget allow you to create a list of element. It's like the "to" field on hotmail.

Introduction

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.

Examples

Declarative example

dojo.require("dojox.form.ListInput");
<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

dojo.require("dojox.form.ListInput");
dojo.ready(function(){
    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";