koperasi/script/form/select.js

function typeSelect(a) {
    var ct = div().class('form-group');
    if (a.line != undefined) {
        ct.css({
            display: 'grid',
            gridTemplateColumns: (function (a) {
                if (Number.isInteger(a) === true) {
                    return a + `px auto`
                } else {
                    return `80px auto`
                }
            })(a.line)
        })
    };
    
    ct.child(
        el('label').html(a.title).css({
            display: 'flex',
            alignItems: 'center'
        })
    );

    var inpt = el('select').class('form-control form-d').name(a.name).id(a.name)
        .css('height', '38px');

    if (a.action != undefined) {
        inpt.addModule('act', a.action).load(function (s) {
            s.el.act(s.el)
        })
    };

    if (a.readonly == true) {
        inpt.attr('readonly', 'true')
            .css({
                background: '#2E7D32',
                color: '#fff'
            });
    };
    
    if (a.multiple != undefined && a.multiple == true) {
        inpt.attr('multiple', 'multiple')
    }else{
        inpt.child(
            el('option').val('').html('...')
        );
    };

    a.data.forEach(function (dt) {
        if(dt.id && dt.text){
            let txt = dt.id + '-' + dt.text;
            if (dt.id.toLowerCase() === dt.text.toLowerCase()){
                txt = dt.text;
            };
            if (a.textonly === true){
                txt = dt.text;
            };
            inpt.child(
                el('option').val(dt.id).html(txt)
            );
        }
    });

    inpt.load(function (s) {
        var id = s.el.id;
        $('#' + id).select2();
        // If readonly, also style select2
        if (a.readonly == true) {
            setTimeout(function() {
                var sel2 = document.querySelector('#select2-' + id + '-container');
                if(sel2) {
                    sel2.parentElement.style.background = '#2E7D32';
                    sel2.parentElement.style.color = '#fff';
                }
            }, 200);
        }
    });

    ct.child(
        inpt
    );
    if (a.info != undefined && typeof a.info === 'string') {
        ct.child(
            el('small').css('font-style', 'italic').html(a.info)
        );
    };
    var dv = div().class('col-md-' + a.row).child(ct);
    
    if (a.display != undefined) {
        dv.css({ display: a.display });
    };
    return dv.get();
}