PopoverX и Pjax

Общие вопросы по использованию второй версии фреймворка. Если не знаете как что-то сделать и это про Yii 2, вам сюда.
Ответить
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

PopoverX и Pjax

Сообщение terrarium volition »

Всем доброго времени суток!

Не могу победить странное поведение у виджета PopoverX, обёрнутого в Pjax.

После выполнения Pjax запроса PopoverX перестаёт работать - виджет просто не открывается. :(

В какую сторону смотреть, уважаемые web-гуру?
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

Нашёл только такой ответ: :(
https://qna.habr.com/q/416163

Помогите, пожалуйста, понять его! :?
unknownby
Сообщения: 749
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: PopoverX и Pjax

Сообщение unknownby »

Там написано, что после срабатывания pjax, все скрипты, которые были добавлены сразу после открытия страницы слетают. И чтобы все работало, нужно эти скрипты снова добавить после pjax complete.
Лично у меня была проблема, что когда я переотрисовывал через ajax кусок калькулятора расчёта стоимости окон, то слетали нужные мне скрипты. Пришлось в контроллере добавлять их вручную, так и тут пишут об этом.
Если я всё правильно понял :)
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

Вот я не могу понять, какую именно часть js добавить в pluginEvents PopoverX ?

Только show: function (skipValidation) ?

Разбираться в этом новичку - это ппц, конечно...все глаза сломал уже

Не поделитесь примером, если не сложно?
Я бы хоть научился, а то головой об стену бьюсь там, где могу просто не использовать этот плагин.

Я пока вообще склоняюсь к варианту отказаться от плагина, но это, конечно, не путь самурая))
Но, если врем будет поджимать, то придётся так и сделать.
unknownby
Сообщения: 749
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: PopoverX и Pjax

Сообщение unknownby »

terrarium volition писал(а): 2021.08.01, 12:28 Вот я не могу понять, какую именно часть js добавить в pluginEvents PopoverX ?

Только show: function (skipValidation) ?

Разбираться в этом новичку - это ппц, конечно...все глаза сломал уже

Не поделитесь примером, если не сложно?
Я бы хоть научился, а то головой об стену бьюсь там, где могу просто не использовать этот плагин.

Я пока вообще склоняюсь к варианту отказаться от плагина, но это, конечно, не путь самурая))
Но, если врем будет поджимать, то придётся так и сделать.
Лично для меня подошло вот это

Код: Выделить всё

    public function actionIndex()
    {
        if(\Yii::$app->request->isAjax){
            \Yii::$app->assetManager->bundles = [
                'kartik\slider\SliderAsset' => false,
                'yii\web\YiiAsset' => false,
                'yii\web\JqueryAsset' => false
            ];

            return $this->renderAjax('_calculator');
        }

        return $this->render('index');
    }
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

Добавил следующий код в action, в который переходим по Pjax-кнопке :

Код: Выделить всё

if(\Yii::$app->request->isAjax){
            \Yii::$app->assetManager->bundles = [
                'kartik\popover-x\PopoverXAsset' => false,
                'yii\web\YiiAsset' => false,
                'yii\web\JqueryAsset' => false
            ];

            return $this->renderAjax('control');
        }
Не помогло, к сожалению.
Но, всё равно, спасибо.
unknownby
Сообщения: 749
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: PopoverX и Pjax

Сообщение unknownby »

terrarium volition писал(а): 2021.08.02, 15:03 Добавил следующий код в action, в который переходим по Pjax-кнопке
Не помогло, к сожалению.
Но, всё равно, спасибо.
Обратите внимание на то, что стоит проверка

Код: Выделить всё

if(\Yii::$app->request->isAjax){
Я в своем проекте отправляю через ajax

Код: Выделить всё

$(document).ready(function(){

    $('.calc-img-wrap img').on('click', function(){
        $.ajax({
            type: 'POST',
            url: 'index',
            data: {
                imgId: $(this).data('id'),
            },
            success: function(result) {
                $('.calc').html(result);
            }
        });
    });

});
После успешного возврата от контроллера renderAjax идёт переотрисовка html в блоке с классом calc.

P.S.
В контроллере я наоборот отключил ассэты, а вы можете включить их. У меня в index идёт рендер представления с калькулятором и через контроллер переотрисовывается. При этом удаляет дублируемые ассэты. Но внутри представления калькулятора есть скрипт, чтобы работали другие поля. А вы смотрите под себя данную вещь. Может вообще кардинально по другому решается ваша проблема ;)
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

По поводу проверки на Ajax - конечно, смотрю, понимаю, что означает.)
Pjax - это по сути Ajax+, в отладчике признаки isPjax и isAjax при сработке Pjax - всегда оба true.

Если я включаю ассэты, то Pjax не работает - вместо этого по Pjax кнопке происходит переход на страницу, а не Ajax запрос.
unknownby
Сообщения: 749
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: PopoverX и Pjax

Сообщение unknownby »

terrarium volition писал(а): 2021.08.02, 16:11 По поводу проверки на Ajax - конечно, смотрю, понимаю, что означает.)
Pjax - это по сути Ajax+, в отладчике признаки isPjax и isAjax при сработке Pjax - всегда оба true.

Если я включаю ассэты, то Pjax не работает - вместо этого по Pjax кнопке происходит переход на страницу, а не Ajax запрос.
Может стоит отказаться от PopoverX и использовать отображение tooltip ? :D

P.S.
Покажите лучше представление, где у вас используется данная вещь, чтобы понимать. Возможно ваш PopoverX не нужно оборачивать Pjax, что решит проблему.
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

Отображения как такового нет. Просто накиданы виджеты пока что.

Суть в следующем:
В PopoverX есть список имён.
Имена в списке могут меняться через виджет Editable в другом поле(не в PopoverX).

Мне нужно, чтобы после смены, имена поменялись и в PopoverX тоже, без перезагрузки страницы.

Для этого я оборачиваю PopoverX в Pjax, и когда происходит смена имени в Editable, обновляется модель ActiveRecord и пишет в базу.
Эта модель должна заново выгрузиться в PopoverX, куда я читаю из базы через ArrayHelper.

Это всё.
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

unknownby писал(а): 2021.08.02, 16:35 tooltip ? :D
А что за tooltip ? :?
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

Так. Стоп.
А что если вернуть после записи через Editable ещё и обновлённый виджет, как переменную, передаваемую из action во view?

И тогда оборачивать PopoverX в Pjax и не надо.

Ушёл проверять.
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

terrarium volition писал(а): 2021.08.02, 18:38 Так. Стоп.
А что если вернуть после записи через Editable ещё и обновлённый виджет, как переменную, передаваемую из action во view?

И тогда оборачивать PopoverX в Pjax и не надо.

Ушёл проверять.
Бред написал какой-то.

В переменную не засунуть PopoverX. :(
unknownby
Сообщения: 749
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: PopoverX и Pjax

Сообщение unknownby »

terrarium volition писал(а): 2021.08.02, 18:59
Бред написал какой-то.

В переменную не засунуть PopoverX. :(
Если показать контроллер и представления, то можно более детальнее помочь. Чем гадать пальцем в небо.
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

View

Код: Выделить всё

<?php Pjax::begin(['enablePushState' => false, 'id' => 'wctrlpanel', 'clientOptions' => ['method' => 'POST']]); ?>
                                    <?php
                                        echo Html::a('', ['site/upvote'], ['class' => 'btn btn-danger glyphicon glyphicon-plus']);
                                        echo Html::a('', ['site/downvote'], ['class' => 'btn btn-danger glyphicon glyphicon-minus']);

                                        $modelTR = Timerequests::findOne('1');

                                        echo Editable::widget([
                                                'name'      =>  'timername', 
                                                'asPopover' =>  false,
                                                'format'    =>  Editable::FORMAT_BUTTON,
                                                'value'     =>  $modelTR->timername,
                                                'formOptions' => [
                                                      'action' => Url::toRoute(['/site/editabledatas', 'id' => 1]),
                                                ],
                                                'inputType' =>  Editable::INPUT_TEXTAREA,
                                                'options'   =>  ['class'=>'form-control', 'prompt'=>'Select status...'],
                                            ]);


                                            PopoverX::begin([
                                                'type' => PopoverX::TYPE_WARNING,
                                                'placement' => PopoverX::ALIGN_RIGHT,
                                                'toggleButton' => ['label'=>'Список', 'class'=>'btn btn-primary'],
                                                'size' => PopoverX::SIZE_SMALL,
                                            ]);
					
					    $tasksortables = SortableInput::widget([
                                            'name'=>'kv-conn-2',
                                            'items' => ArrayHelper::map(Timerequests::find()->orderBy('id')
                                                ->asArray()
                                                ->all(), 'content', 'id', 'timername'),
                                            'hideInput' => true,
                                            'sortableOptions' => [
                                            'itemOptions'=>['class'=>'alert alert-danger'],
                                      
                                            ],
                                            'options' => ['class'=>'form-control', 'readonly'=>true]
                                        ]);
                                        
                                        echo    $tasksortables;
                                        
                                        PopoverX::end();
                                    ?>

                                    <?php Pjax::end() ?>
action

Код: Выделить всё

$votes = Yii::$app->session->get('votes',1);

        if($votes > 1){
            Yii::$app->session->set('votes', --$votes);
        }else{
            Yii::$app->session->set('votes', 1);
        }

        $model = new ControlForm();
        
        return $this->render('control', [
            'model'         =>  $model,
        ]);

Но какой action у кнопок - не важно.
Он просто увеличивает кол-во $votes и пишет в сессию.

action для Editable - не имеет значения, т.к. он работает и относится к PopoverX никак.
Там просто запись в модель Timerequests, из которой я потом пишу в PopoverX, как я написал в посте выше.
unknownby
Сообщения: 749
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: PopoverX и Pjax

Сообщение unknownby »

terrarium volition писал(а): 2021.08.02, 21:33 action для Editable - не имеет значения, т.к. он работает и относится к PopoverX никак.
Там просто запись в модель Timerequests, из которой я потом пишу в PopoverX, как я написал в посте выше.
В таком случае может попробовать вынести PopoverX за пределы Pjax? Скорее всего желательней так вынести. Я проверил у себя. Когда кнопка с PopoverX находится внутри Pjax, то не работает после срабатывания Pjax. Хотя кнопка со статическим контентом.
И маленький совет :)
Можно вместо такой записи

Код: Выделить всё

$tasksortables = SortableInput::widget([
  'name'=>'kv-conn-2',
  'items' => ArrayHelper::map(Timerequests::find()->orderBy('id')->asArray()->all(), 'content', 'id', 'timername'),
  'hideInput' => true,
  'sortableOptions' => [
  'itemOptions'=>['class'=>'alert alert-danger'],
 ],
 'options' => ['class'=>'form-control', 'readonly'=>true]
]);
                                        
echo $tasksortables;
Сделать такую запись

Код: Выделить всё

<?= SortableInput::widget([
  'name'=>'kv-conn-2',
  'items' => ArrayHelper::map(Timerequests::find()->orderBy('id')->asArray()->all(), 'content', 'id', 'timername'),
  'hideInput' => true,
  'sortableOptions' => [
  'itemOptions'=>['class'=>'alert alert-danger'],
 ],
 'options' => ['class'=>'form-control', 'readonly'=>true]
]); ?>
terrarium volition
Сообщения: 99
Зарегистрирован: 2021.07.15, 21:22

Re: PopoverX и Pjax

Сообщение terrarium volition »

В таком случае может попробовать вынести PopoverX за пределы Pjax? Скорее всего желательней так вынести. Я проверил у себя. Когда кнопка с PopoverX находится внутри Pjax, то не работает после срабатывания Pjax. Хотя кнопка со статическим контентом.
А как тогда обновлять содержимое в PopoveX ?
Я же меняю имя через Editable, а в PopoverX оно остаётся старым. Мне вот его и нужно обновить без перезагрузки страницы.
И маленький совет :)
Эт я знаю, просто юзаю эту переменную ещё в другом месте.

Чего делать, помогите, народ! :o :roll: :cry:
Ответить