User Instance

Paste the following code into the head section of your site’s HTML.

<link rel="stylesheet" type="text/css" href="src/ax5ui-select/dist/ax5select.css">
<script type="text/javascript" src="src/ax5ui-select/dist/ax5select.min.js"></script>

<form name="forms" class="form-inline">
    <div class="form-group">
        <div data-ax5select="select1"></div>
    </div>

    <button type="button" class="btn" data-btn="setValue">setValue</button>
    <button type="button" class="btn" data-btn="getValue">getValue</button>

</form>

<script type="text/javascript">
    var select = new ax5.ui.select();
    $(document.body).ready(function () {
        var EL = $('[data-ax5select="select1"]');
        select.bind({
            theme: "success",
            size: "lg",
            target: EL,
            options: [
                {value:'1', text:'text 1'},
                {value:'2', text:'text 2'},
                {value:'3', text:'text 3'},
                {value:'4', text:'text 4'}
            ],
            onStateChanged: function () {
                //console.log(this);
            }
        });

        $('[data-btn]').click(function () {
            var act = this.getAttribute("data-btn");
            switch (act) {
                case "setValue":
                    select.val(EL, 3);
                    break;
                case "getValue":
                    console.log(select.val(EL));
                    break;
            }
        });
    });
</script>