A
A
Alexander Pantyukhov2016-09-16 07:15:34
css
Alexander Pantyukhov, 2016-09-16 07:15:34

How to change css option in Select2 kartik?

Good day.
Select2 is created on the page

echo $form->field($modelForm, 'applicationTypeId')->widget(\kartik\widgets\Select2::classname(), [
    'data' => $modelForm->selectSaleType,
    'pluginOptions' => [
       'width' => '155px'
    ],
    'pluginEvents' => [
//        "select2:open" => "function() { }",
//        "select2:close" => "function() {}",
    ],
    'options' => ['placeholder' => 'All', 'multiple' => true],
]);

when clicked, a container window opens with options to choose from.
The question is, how to make the opening container display the entire list, but only for this select2?
Option 1: In pluginEvents I add select2: open and select2: close in which it is necessary to change the container's "max-height" parameter of the style or class ".select2-container--krajee .select2-results > .select2-results__options", but I don't know how to contact him.
Option 2: Does select2 itself have some parameter so that the opening container opens completely?
Maybe someone else has options how to solve the problem so that it would work only for one select2 and not for all?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Alexander Pantyukhov, 2016-09-16
@Paromon

Found a solution. Suddenly a coma is necessary. It's not as elegant but it works. It is necessary to insert in the description of Select2

'pluginEvents' => [
            "select2:open" => 'function() { $(".select2-results__options").css("max-height","2000px") }',
        ],

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question