Select2

Select2 for WireBootstrap

Select2 gives you a customizable select box with support for searching, tagging, remote data sets, infinite scrolling, and many other highly used options.

Select2 for WireBootstrap brings Select2 into the WireBootstrap framework providing a powerful way of filtering data in applications developed with Bootstrap themes.

Installation

The Select2 for WireBootstrap library is located in wire-select2.js. This and other other related files can be installed from the NPM package registry at@wirebootstrap/wire-select2.

npm install @wirebootstrap/wire-select2

Select2 for WireBootstrap will load select2.full.min.js from a CDN if it's not found on the page.

Select2 for WireBootstrap will load select2.min.css from a CDN if not found on the page.

Class

Select2 for WireBootstrap extends the wire.ui.component class. As such, it inherits all the base functionality of that class.

To create a new instance of the Select2 for WireBootstrap component, use the wire.select2 class.

const select2 = new wire.select2();

Render

Render the component using an HTML select element.

JavaScript

<select id="select" class="form-control"></select>
<script>
    new wire.select2().render("#select", {});
</script>

Web Component

<wire-select2 wr-config=""></wire-select2>

React

<WireComponent component="wire.select2" config={}>
    <select className="form-control"></select>
</WireComponent>

Vue

<select 
    wire-component="wire.select2" 
    v-wire-config="" 
    class="form-control">
</select>

Angular

<select 
    wire-component="wire.select2" 
    [config]="" 
    class="form-control">
</select>