How to update widget using pjax in modal window in yii2

Question

I have two ActiveForms in a modal window and after submitting the first form I need to update the second and stay in the modal form.

As I understand it, pjax can handle this, but cannot make it work correctly.

In _form.php, I have an ActiveForm with widgets that need to be updated:

<?php $form = ActiveForm::begin([ 'id'=>'form', 'enableAjaxValidation'=>true, ]); ?> <?= Html::activeHiddenInput($riskModel, 'id', ['value' => $riskModel->id]) ?> <?php Pjax::begin([ 'id' => 'solutionItems', ]) ?> //need to update this widget <?= $form->field($riskModel, 'solutions_order')->widget(SortableInput::classname(), [ 'items' => $riskModel->getSolutionList(), 'hideInput' => false, 'options' => ['class'=>'form-control', 'readonly'=>false] ]); ?> <?php Pjax::end() ?> <div class="form-group"> <?= Html::submitButton($riskModel->isNewRecord ? 'Create' : 'Update', ['class' => $riskModel->isNewRecord ? 'btn btn-success' : 'btn btn-primary', 'onclick' => 'return isConnected()']) ?> </div> <?php ActiveForm::end(); ?> 

And then I have an Ajax request that returns success if a new solution is created:

  $.ajax({ url: form.attr('action'), type: 'post', data: form.serialize(), success: function (data) { if (data && data.result == 1) { $.pjax.reload({container:'#solutionItems'}); } }, error: function (XMLHttpRequest, textStatus, errorThrown) { $("#error").html("Kļūda! Neizdevās pievienot ierakstu.").fadeIn('highlight','', 2000, callbackError()); $("#solutions-solution").val(""); } }); 

But

  $.pjax.reload({container:'#solutionItems'}); 

closes the modal :( If I put the return value in a div, then ajax will work correctly, but the modal does not close.

Answer 1

Managed without $ .pjax, just added this

  $("#risks-solutions_order-sortable").append('<li data-id="'+data.id+'" data-key="'+data.id+'" draggable="true">'+data.solution+'</li>'); $("ul[id$='sortable'").trigger('sortupdate'); $('#risks-solutions_order-sortable').sortable( "refreshPositions" ); 

success in ajax and everything is fine! :)

Answer 2

Perhaps increasing / disabling the timeout can help solve this problem.

 $.pjax.reload('#solutionItems', {timeout : false}); 

You can find more detailed information here: yii2 how to use pjax when the hyperlink is not in pjax