Forms Select

Edit on Gitlab

Table of Contents

Select

Draw aselect box with option fields

Syntax

$renderAdminLTE->getFormSelect($aOptions);

Return

{string} html code

Parameters

  • $aOptions - {array} options to describe the element

Option fields:

Key Description
options List of option tags
- value - value in the option
- label - visible text in the option
other keys are attributes in the option

Styling for select tag:

Key Description
bootstrap-select optional: use bootstrap-select pugin with live search (you need to load the plugin in your page - see example below)
class optional: additional css classes
size optional: visible option lines

Content:

Key Description
hint optional: Hint text above form field
name name attribute for sending form data
value value of the input field/ visible text; for checkbox and radio: the data to send when sending a form

Example

Simple select box

$renderAdminLTE->getFormSelect([
    'label' => 'Select contact',
    'name' => 'contact',
    'tag' => 'select',
    'size' => 1,
    'options' => [
            ['value' => '',  'label' => 'select'],
            ['value' => '1', 'label' => 'Tom'],
            ['value' => '2', 'label' => 'Dick', 'selected' => 1 ],
            ['value' => '3', 'label' => 'Harry'],
    ],
]);

You get a label, an select box wrapped in a <div class="form-group row">.

<div class="form-group row">
    <label for="contact-39c4c14176af359d95e81c45078f27f3" class="col-sm-2 col-form-label">Select contact</label>
    <div class="col-sm-10">
        <div class="form-group">
            <select name="contact" tag="select" size="1" class="form-control ">
                <option value="">select</option>
                <option value="1">Tom</option>
                <option value="2" selected="1">Dick</option>
                <option value="3">Harry</option>
            </select>
        </div>
    </div>
</div>

Select box with search field

We added support for the plugin bootstrap-select. Get its files from the website and put it into a vendor directory.

Website: https://developer.snapappointments.com/bootstrap-select/

In your html header section add its css and javascript:

    <!-- bootstrap-select -->
    <link rel="stylesheet" href="../vendor/bootstrap-select/1.13.18/css/bootstrap-select.min.css">
    <script src="../vendor/bootstrap-select/1.13.18/js/bootstrap-select.min.js"></script>

In your select box add 'bootstrap-select' => 1, :

$renderAdminLTE->getFormSelect([
    'label' => 'Select contact',
    'name' => 'contact',
    'tag' => 'select',
    'size' => 1,
    'bootstrap-select' => 1, // <---------- 
    'options' => [ ... ],
]);