Is there any way to render partial view using AJAX that is a part of form which other part starts ActiveForm->begin() in main view?
Controller:
public function actionCreate()
{
$model = new order();
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())) {
try {
if ($model->save()) {
Yii::$app->getSession()->setFlash('success', 'New record has been saved.');
return $this->redirect(['index']);
}
}
catch(yii\db\IntegrityException $e) {
Yii::$app->getSession()->setFlash('error', 'Cannot save new record. Please try again.');
return $this->redirect(['index']);
}
}
else {
return $this->render('create', ['model' => $model, ]);
}
}
public function actionSpecialdetform()
{
$model = new order();
return $this->renderAjax('_specialform');
}
public function actionDetform()
{
$model = new order();
return $this->renderAjax('_form');
}
View (main - create.php):
<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
/* @var $this yii\web\View */
/* @var $model app\models\order */
$this->title = 'Create';
$this->params['breadcrumbs'][] = ['label' => 'Orders', 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="order-create">
<h1><?= Html::encode($this->title) ?></h1>
<?php $form = ActiveForm::begin(['enableAjaxValidation' => true,]); ?>
<div class="panel panel-default wizard" id="order-wizard">
<div class="wizard-steps clearfix" id="form-wizard">
<ul class="steps">
<li data-target="#step1" class="active"><span class="badge badge-info">1</span>Order</li>
<li data-target="#step2"><span class="badge">2</span>Details</li>
</ul>
</div>
<div class="step-content clearfix">
<div class="step-pane active" id="step1">
<?php echo $form->field($model, 'order_date')->input(); ?>
</div>
<div class="step-pane" id="step2">
<div id="order-details">
</div>
</div>
<div class="actions pull-left">
<button type="button" class="btn btn-default btn-sm btn-prev wizard-btn" disabled="disabled"><i class="fa fa-angle-double-left" style="margin-right:5px"></i> Previous step</button>
<button type="button" class="btn btn-default btn-sm btn-next wizard-btn" data-last="Save">Next step <i class="fa fa-angle-double-right" style="margin-left:5px"></i></button>
</div>
</div>
</div>
<?php ActiveForm::end(); ?>
</div>
<?php
$js = '
$(document).ready(function() {
$("#order-wizard").on("change", function(e, data) {
if(data.step===1 && data.direction==="next")
{
var date = $("#order-order_date").val();
if(date==="")
{
e.preventDefault();
}
var form = null;
if(date === "2015-01-01")
{
form = "/order/specialdetform"
}
else
{
form = "order/detform"
}
$.ajax({
url: form,
dataType: "html",
success: function(data) {
$("#order-details").html(data);
}
});
}
});
});
';
$this->registerJs($js, \yii\web\View::POS_END);
?>
Partial View - (_specialform.php):
<?= $form->field($model, 'promo_code')->input(); ?>
<?= $form->field($model, 'Surname')->input(); ?>
Partial View - (_form.php):
<?= $form->field($model, 'Surname')->input(); ?>
I don’t want to just create one partial view, because this is only one different field, but it’s an example.