How to remove scrolling up when clicking on select2?

Question

Yii

I have such a problem, when the page opens and I select select2 which is built on ajax requests, then I am thrown to the top. I looked in js what could affect, at first I thought that it was dropdownParentas written here . But no, it will still scroll up to the body tag.

<?= Select2::widget([
                            'initValueText' => Html::encode($arrList['city']), // set the initial display text
                            'name' => 'Profile[city]',
                            'options' => ['placeholder' => 'Начните вводить '],
                            'value' => Html::encode($profile->city),
                            'language' => 'ru',
                            'pluginOptions' => [
                                'dropdownParent' => new yii\web\JsExpression('$("#personal-index")'),
                                'allowClear' => true,
                                'minimumInputLength' => 1,
                                'language' => [
                                    'errorLoading' => new JsExpression("function () { return 'Поиск...'; }"),
                                    'inputTooShort' => new JsExpression("function (args) {
                            var remainingChars = args.minimum - args.input.length;

                            var message = 'Пожалуйста, введите ' + remainingChars + ' или более символов';

                            return message;
                        }"),
                                'loadingMore' => new JsExpression("function () {return 'Загружаем ещё ресурсы…';}"),
                                'searching' => new JsExpression("function () {return 'Поиск…';}"),
                                'noResults' => new JsExpression("function () {return 'Ничего не найдено…';}"),
                            ],
                            'ajax' => [
                                'url' => Url::to(['user/city-list']),
                                'dataType' => 'json',
                                'data' => new JsExpression('function(params) { return {q:params.term}; }')
                            ],
                            'escapeMarkup' => new JsExpression('function (markup) { return markup; }'),
                            'templateResult' => new JsExpression('function(user) { return user.text; }'),
                            'templateSelection' => new JsExpression('function (user) { return user.text; }'),
                            ],
                        ]) ?>

Here is the whole code

Answer 1

On the topic https://github.com/select2/select2/issues/5022 , you need to comment out top and then it will not scroll

$dropdown.css({
      position: 'absolute',
      // top: -999999
    });