1. Home
  2. Classes
  3. VlSelect

new VlSelect()

Description

Gebruik de select component om gebruikers toe te laten een selectie te maken uit een lijst met voorgedefinieerde opties. Het is aangeraden om enkel deze component te gebruiken als er 5 of meer opties zijn. Bij minder opties, kan er gebruik gemaakt worden van de radio component.

Properties
Name Type Description
data-vl-block boolean

Attribuut wordt gebruikt om ervoor te zorgen dat de textarea getoond wordt als een block element en bijgevolg de breedte van de parent zal aannemen.
data-vl-error boolean

Attribuut wordt gebruikt om aan te duiden dat het select element verplicht is of ongeldige tekst bevat.
data-vl-success boolean

Attribuut wordt gebruikt om aan te duiden dat het select element correct werd ingevuld.
data-vl-disabled boolean

Attribuut wordt gebruikt om te voorkomen dat de gebruiker iets kan kiezen uit het select element.
data-vl-select boolean

Attribuut zorgt ervoor dat de zoek functionaliteit geïnitialiseerd wordt.
data-vl-select-search boolean

Attribuut om de zoek functionaliteit te activeren of deactiveren.
data-vl-select-search-empty-text boolean

Attribuut bepaalt de tekst die getoond wordt wanneer er geen resultaten gevonden zijn.
data-vl-select-search-result-limit boolean

Attribuut om het aantal resultaten te limiteren.
data-vl-select-search-no-result-limit boolean

Attribuut om het aantal resultaten te limiteren.
data-vl-select-deletable boolean

Attribuut om te activeren of deactiveren dat het geselecteerde kan verwijderd worden.
data-vl-search-placeholder string

Attribuut bepaalt de placeholder van het zoek adres input element.
data-vl-search-no-results-text string

Attribuut bepaalt de tekst wanneer er geen zoekresultaten meer zijn.
data-vl-no-more-options string

Attribuut bepaalt de tekst wanneer er geen keuzes meer mogelijk zijn.
Details

HTMLSelectElement

nativeVlElement

vl-select.js, line 35

Members

<static> readyEvent

Description

Geeft de ready event naam.

Returns
Details

vl-select.js, line 42

readyEvent

Description

Geeft de ready event naam.

Returns
Details

vl-select.js, line 69

choices

Description

Zet de mogelijkheden die gekozen kunnen worden.

Parameters
Name Type Description
choices Array.<Object>

met value en label attribuut.
Details

vl-select.js, line 190

sortFilter

Description

Zet sorteer functie voor de mogelijke keuzes.

Parameters
Name Type Description
fn function

bi-functie die de mogelijke keuzes sorteert.
Details

vl-select.js, line 199

value

Description

Zet het geselecteerd option element op basis van de option value.

Parameters
Name Type Description
value string

de option value van het option element dat gekozen moet worden.
Details

vl-select.js, line 208

value

Description

Geeft de waarde van het eerst geselecteerde option element indien deze er is, anders een lege string.

Returns
Details

vl-select.js, line 221

_choices

Description

Geef de Choices instantie.

Returns

de Choices instantie of null als de component nog niet geïnitialiseerd is door dress()

Details

vl-select.js, line 231

https://www.npmjs.com/package/choices.js

_wrapperElement

Description

Geef de 'js-vl-select' wrapper terug dat door de dress functie wordt gegenereerd wordt.

Returns

geeft 'js-vl-select' div terug of 'null' als de component nog niet geinitialiseerd is door 'dress()'

Details

vl-select.js, line 242

Methods

dress( params )

Description

Initialiseer de Choices config.

Parameters
Name Type Description
params Object

object with callbackFn: function(select) with return value the items for setChoices
Fires
Details

vl-select.js, line 272

https://www.npmjs.com/package/choices.js

<async> ready() → {Promise}

Description

Geeft een promise die 'resolved' wanneer de select initialisatie klaar is.

Returns

De promise

Details

vl-select.js, line 295

undress()

Description

Vernietigt de Choices instantie van deze component.

Details

vl-select.js, line 304

https://www.npmjs.com/package/choices.js

enable()

Description

Activeer de component.

Details

vl-select.js, line 318

disable()

Description

Deactiveer de component.

Details

vl-select.js, line 325

removeActive()

Description

Verwijder de actieve geselecteerde optie.

Details

vl-select.js, line 332

showDropdown()

Description

Toon de dropdown met de mogelijke keuzes.

Details

vl-select.js, line 339

hideDropdown()

Description

Verberg de dropdown met de mogelijke keuzes.

Details

vl-select.js, line 346

focus()

Description

Geeft focus aan het element.

Details

vl-select.js, line 353