Select, Combo & Autocomplete

Select from Items in Schema

Select Data on or more values from an array defined in Schema, it can be an array of numbers, strings or objects declared in items:[] property of schema.

Select

The Select Control allows users to select one or multiple options from a list of items

model: {
   single: "Musk",
   multi: [
      "Musk",
      "Taleb"
   ],
   object: {
      "name": "This is C",
      "val": "C"
   }
}
// Select:
schema: { 
    single: { 
        type:'select', 
        items:['Musk', 'Jobs', 'Taleb', 'Harari'] 
    },
    multi: { 
        type:'select', 
        items:['Musk', 'Jobs', 'Taleb', 'Harari'], 
        multiple:true 
    },
    object: { 
        type: 'select', 
        returnObject:true, 
        itemText:'name', 
        items: [
            { name:'This is A', val:'A'}, 
            { name:'This is B', val:'B'}, 
            { name:'This is C', val:'C'}]
        ]
    },
}

Combobox

The ComboBox Control is used to display a drop-down list of various items. It is a combination of a text box in which the user enters an item and a drop-down list from which the user selects an item.

// Combobox:
schema: { 
    combobox: { 
        type:'combobox', 
        items:['Musk', 'Jobs', 'Taleb', 'Harari'] 
    }, 
    ... 
}

Autocomplete

An Autocomplete Control shows suggestions that match what the user types as they type. Users can select a suggestion to complete their entry quickly

// Autocomplete:
schema: { 
    autocomplete: { 
        type:'autocomplete', 
        items:['Musk', 'Jobs', 'Taleb', 'Harari'] 
    }, 
    ... 
}

Last updated