ajax - multiple controller actions one form

hello, wondering if anyone can help out with an ajax type question:

I have a page that is made up of 2 areas, each of these areas are actually embedded ajax calls to controller actions.

For example


<?php


use yii\helpers\Html;

use yii\widgets\DetailView;

use yii\widgets\Pjax;


/* @var $this yii\web\View */

/* @var $model common\models\User */


$this->title = $user->username;

//$this->params['breadcrumbs'][] = ['label' => 'Users', 'url' => ['index']];

$this->params['breadcrumbs'][] = $this->title;

?>


<div class="user-view">


    <h1><?= Html::encode($this->title) ?></h1>   

    

    <div class="container-fluid">

        <div class="row">

            

    		<div class="col-md-6">

    		<?php Pjax::begin(['enablePushState' => false]); ?>

	        <div  id="profile-person-view">

                <!-- person record to be rendered through ajax -->

            </div>

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

    		</div>


    		<div class="col-md-6">

    		<?php Pjax::begin(['enablePushState' => false]); ?>

    		<div  id="profile-telephone-index">

                <!-- telepone records to be rendered through ajax -->

            </div>

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

    		</div>

    		

    	</div>

    	

    </div>   

</div>


<?php 

// render person view view

$js = <<<js

        $(document).on('load',$.ajax({

            url: '%s',

            success: function (data) {

            	$('#profile-person-view').html(data);

           }

        }));

js;

    $Url = Yii::$app->request->baseUrl . '/profile/profile-person/view?id=' . $user->person->id;

    $js = sprintf($js, $Url);

    $this->registerJs($js);

    

    // render telephone index view

$js = <<<js

        $(document).on('load',$.ajax({

            url: '%s',

            success: function (data) {

            	$('#profile-telephone-index').html(data);

           }

        }));

js;

    $Url = Yii::$app->request->baseUrl . '/profile/profile-telephone/index?id=' . $user->id;

    $js = sprintf($js, $Url);

    $this->registerJs($js);

?>



I have one area to get a client’s telephone numbers. To do this is ajax calls the telephone/index action passing the clients id. This renders lovely! :)

I also have another area on this page that ajax renders the client/view. This allows me to view the clients details. This again renders on the view lovely. So I have the client details and the telephone details for that client on one page! Awesome.

7326

Screenshot_2017-03-13_20-44-11.png

What I am now trying to achieve is to allow for updating of a clients details, without leaving this page, hence the ajax calls to controller/actions.

If I press the update button on the client/view section, the form renders in line, which is perfect! still on the same page! Great!

When I hit the update button on that form. I get redirected to the non ajax client/view… boo!!

I have tried to detect if the update post is ajax, but it does not treat it as such.


public function actionUpdate($id) isAjax but this does not work. it just redirects to the client/view action.

    {       

        $model = $this->findModel($id);


        if ($model->load(Yii::$app->request->post()) && $model->save()) {

            if(Yii::$app->request->isAjax)

            {

// Never gets in this block <img src='http://www.yiiframework.com/forum/public/style_emoticons/default/sad.gif' class='bbc_emoticon' alt=':(' />

                return $this->redirect(['/profile']);

            }

            else 

            {

                return $this->redirect(['view', 'id' => $model->id]);

            }

        } else {

            if (Yii::$app->request->isAjax){

                return $this->renderAjax('update', [

                    'model' => $model,

                ]);

            }

            else {

                return $this->render('update', [

                    'model' => $model,

                ]);

            }

        }

    }

Your content is being loaded via ajax but it’s not submitting via ajax. You just need to submit the form via ajax.


jQuery('.yourForm').on('beforeSubmit', function () {

    jQuery.ajax({

        ...

    });

    return false;

}

Thank you! Will try that.

EDIT: Success!

Put the following in the update view of the form you’re updating


 

<?php

$js = <<<js

    $('#person-form').on('beforeSubmit', function () {

       var datastring = $('#person-form').serialize();

       $.ajax({

          type: "POST",

          data: datastring,

          url: '%s',

    });

        return false;

    });

js;

        

    $Url = Yii::$app->request->baseUrl . '/profile/profile-person/update?id=' . $user->person->id;

    $js = sprintf($js, $Url);

    $this->registerJs($js);


?>



Here is the form data:




<div class="person-form">


    <?php $form = ActiveForm::begin([

        'id' => 'person-form'

    ]); ?>


    <?= $form->field($model, 'title')->textInput(['maxlength' => true]) ?>


    <?= $form->field($model, 'firstName')->textInput(['maxlength' => true]) ?>


    <?= $form->field($model, 'secondName')->textInput(['maxlength' => true]) ?>


    <?= $form->field($model, 'thirdName')->textInput(['maxlength' => true]) ?>


    <?= $form->field($model, 'surname')->textInput(['maxlength' => true]) ?>


    <?= $form->field($model, 'createdAt')->textInput() ?>


    <?= $form->field($model, 'updatedAt')->textInput() ?>


    <?= $model->activeStringField($form, $model) ?>

	

    <div class="form-group">

        <?= Html::submitButton($model->isNewRecord ? 'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>

    </div>


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


</div>