How to make form submit and autoupdate ListView?

Question

Yii

Hello. I understand that the topic is rather hackneyed, but after a day of trials, nothing happened. The bottom line is this: there is a widget, it contains a form for adding a comment and a view sheet

<?
$form = ActiveForm::begin(['id' => 'form-feedback',
                           'enableAjaxValidation' => true,
                           'action' => '/feedback/index'
                            ]);?>
?>

<?= $form->field($model, 'name')->textInput(['value' => !Yii::$app->user->isGuest ? Yii::$app->user->identity->username : '']) ?>

<?= $form->field($model, 'email')->textInput(['type' => 'email', 'value' => !Yii::$app->user->isGuest ? Yii::$app->user->identity->email : ''])?>

<?= $form->field($model, 'comments')->textarea(['rows' => 5]) ?>

<?= $form->field($model, 'id_obj')->textInput(['type' => 'hidden', 'value' => $id_obj])->label(false)?>

<?= $form->field($model, 'type')->textInput(['type' => 'hidden', 'value' => $type])->label(false)?>

<div class="form-group">
    <?= Html::submitButton('<span>Отправить</span>', ['class' => 'btn btn-primary reg-btn', 'name' => 'signup-button']) ?>
</div>

<?php ActiveForm::end(); ?>


<?= ListView::widget([
    'dataProvider' => $dataProvider,
    'itemView' => '_list',
    'layout' => "{summary}\n{items}\n{pager}",
    'summary' => '',
    'itemOptions' => [
        'tag' => 'div',
        'class' => 'feedback',
    ],
]);
?>

controller that processes the data

public function actionIndex(){

        $model = new Feedback;
        
        if (Yii::$app->request->isAjax && $model->load(Yii::$app->request->post())) {
            Yii::$app->response->format = Response::FORMAT_JSON;
            return ActiveForm::validate($model);
        }

        if ($model->load(Yii::$app->request->post()) && $model->save()) {
                    return Yii::$app->getResponse()->redirect(['/']);

        }
    }

The task is such that it is necessary to do validation when submitting the form, save the data and immediately update the view sheet without reloading.
I tried many different ways, but I get errors in the console, one of them is the pjax Aborted error.
Thank you in advance for your help.

Answer 1

<?php
Pjax::begin(['id'=>'pjax-container-form']);
$form = ActiveForm::begin(['id' => 'form-feedback',
                           'enableAjaxValidation' => true,
                           'action' => '/feedback/index',
                           'options' => ['data-pjax' => true]
                            ]);?>

<?= $form->field($model, 'name')->textInput(['value' => !Yii::$app->user->isGuest ? Yii::$app->user->identity->username : '']) ?>

<?= $form->field($model, 'email')->textInput(['type' => 'email', 'value' => !Yii::$app->user->isGuest ? Yii::$app->user->identity->email : ''])?>

<?= $form->field($model, 'comments')->textarea(['rows' => 5]) ?>

<?= $form->field($model, 'id_obj')->textInput(['type' => 'hidden', 'value' => $id_obj])->label(false)?>

<?= $form->field($model, 'type')->textInput(['type' => 'hidden', 'value' => $type])->label(false)?>

<div class="form-group">
    <?= Html::submitButton('<span>Отправить</span>', ['class' => 'btn btn-primary reg-btn', 'name' => 'signup-button']) ?>
</div>

<?php ActiveForm::end(); ?>
<?php Pjax::end(); ?>


<?Pjax::begin(['id'=>'pjax-container-comments']);?>
<?= ListView::widget([
    'dataProvider' => $dataProvider,
    'itemView' => '_list',
    'layout' => "{summary}\n{items}\n{pager}",
    'summary' => '',
    'itemOptions' => [
        'tag' => 'div',
        'class' => 'feedback',
    ],
]);
?>

<? Pjax::end();?>
<?php
$this->registerJs('
            $("#pjax-container-form").on("pjax:end", function() {
                var url = "' . Url::toRoute(['/feedback/index']) . '";
                $.pjax({url: url, container: "#pjax-container-comments"});
            })');
?>