在yii2中使用模態創建表單輸入很奇怪

Question

我試過用模態創建表單輸入。當我在瀏覽器中執行成功。但是，當我在文本字段中進行驗證測試時，使用模式重定向到其他頁面的insted表單輸入。有關詳細信息，請參閱下面的內容。

當我執行。

測試驗證重定向到其他頁面。

在控制器代碼

public function actionCreate() 
 
    { 
 
     $model = new Donatur(); 
 
     if ($model->load(Yii::$app->request->post()) && $model->save()) { 
 
       Yii::$app->session->setFlash('success', 'Data berhasil disimpan!'); 
 
       return $this->redirect(['index']); 
 
       return $this->refresh(); 
 
      } else { 
 
       if (Yii::$app->request->isAjax) { 
 
        return $this->renderAjax('create', ['model' => $model]); 
 
       } 
 
       else{ 
 
        return $this->render('create', ['model' => $model]); 
 
       } 
 
      } 
 
    }

代碼create.php鑑於

<?php 
 

 
use yii\helpers\Html; 
 
use yii\bootstrap\ActiveForm; 
 
use yii\widgets\Pjax; 
 
use yii\bootstrap\Modal; 
 
use yii\helpers\Url; 
 
use yii\db\ActiveRecord; 
 

 
/* @var $this yii\web\View */ 
 
/* @var $model app\models\Donatur */ 
 
?> 
 

 
<h2 align="center">Form Donatur</h2> 
 

 
<?php $form = ActiveForm::begin(['layout' => 'horizontal', 
 
    'fieldConfig' => [ 
 
     'template' => "{label}\n{beginWrapper}\n{input}\n{hint}\n{error}\n{endWrapper}", 
 
      'horizontalCssClasses' => [ 
 
      'label' => 'col-sm-4', 
 
      'offset' => 'col-sm-offset-4', 
 
      'wrapper' => 'col-sm-8', 
 
      'error' => '', 
 
      'hint' => '', 
 
      'button' => 'col-sm-4' 
 
     ], 
 
    ], 
 
    ]); ?> 
 

 
<?= $form->field($model, 'kode_donatur')->textInput(['readonly' => true, 'style'=>'width:100px']) ?> 
 
<?= $form->field($model, 'nama_donatur')->textInput(['style'=>'width:350px']) ?> 
 
<?= $form->field($model, 'alamat')->textArea(['rows' => 3, 'style'=>'width:350px']) ?> 
 
<?= $form->field($model, 'telepon')->textInput(['style'=>'width:300px']) ?> 
 
<div class="form-group"> 
 
    <div class="col-sm-offset-4"> 
 
<?= Html::submitButton('Simpan', ['class'=> 'btn btn-primary']) ?> 
 

 
<?php 
 
echo "&nbsp"; 
 
echo "&nbsp"; 
 
echo Html::a('Keluar', ['index'],[ 
 
\t 'class'=>'btn btn-success', 
 
\t 'onclick' =>'$("#donaturModal").modal("hide"); 
 
\t return false;' 
 
\t ]); 
 
?> 
 
    </div> 
 
</div> 
 
<?php ActiveForm::end();?>

在夾網鑑於

代碼的index.php

<?php \yii\widgets\Pjax::begin(['timeout' => false, 'id' => 'pjax-gridview']); ?> 
 

 
<?php 
 
use yii\helpers\Html; 
 
use yii\grid\GridView; 
 
use yii\widgets\Pjax; 
 
use yii\bootstrap\Modal; 
 
use yii\helpers\Url; 
 

 
/* @var $this yii\web\View */ 
 
/* @var $searchModel app\models\SearchDonatur */ 
 
/* @var $dataProvider yii\data\ActiveDataProvider */ 
 

 
$this->title = 'Data Donatur'; 
 
?> 
 

 
<?php if (Yii::$app->session->hasFlash('success')): ?> 
 
    <div class="alert alert-success alert-dismissable"> 
 
    <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button> 
 
    <h4><i class="icon fa fa-check"></i>Informasi!</h4> 
 
    <?= Yii::$app->session->getFlash('success') ?> 
 
</div> 
 
<?php endif; ?> 
 

 

 
<?php if (Yii::$app->session->hasFlash('delete')): ?> 
 
    <div class="alert alert-success alert-dismissable"> 
 
    <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button> 
 
    <h4><i class="icon fa fa-check"></i>Informasi!</h4> 
 
    <?= Yii::$app->session->getFlash('delete') ?> 
 
    </div> 
 
<?php endif; ?> 
 

 

 
<div class="donatur-index"> 
 
    
 
    <?php Pjax::begin(['timeout'=>false,'id'=>'pjax-gridview']); ?> 
 
     
 
    <h1><?= Html::encode($this->title) ?></h1> 
 
    <?php // echo $this->render('_search', ['model' => $searchModel]); ?> 
 

 
    <p> 
 
     <?= Html::button('Tambah Donatur', ['value'=>Url::to('create'),'class' => 'btn btn-success','id'=>'modalButton']) ?> 
 
    </p> 
 

 
    
 
    <?= GridView::widget([ 
 
     'dataProvider' => $dataProvider, 
 
     'filterModel' => $searchModel, 
 
     'emptyCell'=>'-', 
 
     'summary'=>'', 
 
     'columns' => [ 
 
      //['class' => 'yii\grid\SerialColumn'], 
 
      [ 
 
      'attribute'=>'kode_donatur', 
 
      'value'=>'kode_donatur', 
 
      'contentOptions'=>['style'=>'width: 200px;'] 
 
      ], 
 

 
      [ 
 
      'attribute'=>'nama_donatur', 
 
      'value'=>'nama_donatur', 
 
      'contentOptions'=>['style'=>'width: 250px;'] 
 
      ], 
 
      [ 
 
      'attribute'=>'alamat', 
 
      'value'=>'alamat', 
 
      'contentOptions'=>['style'=>'width: 350px;'] 
 
      ], 
 
      [ 
 
      'attribute'=>'telepon', 
 
      'value'=>'telepon', 
 
      'contentOptions'=>['style'=>'width: 290px;'] 
 
      ], 
 

 

 

 
      [ 
 
      'class' => \yii\grid\ActionColumn::className(), 
 
      'header' => 'Aksi', 
 
      'template' => '{update} {delete}', 
 
      'buttons' => [ 
 
       'update' => function($url, $model) { 
 
        $icon = '<span class="glyphicon glyphicon-pencil"></span>'; 
 
        return Html::a($icon, $url,[ 
 
         'data-toggle' => "modal", 
 
         'data-target' => "#donaturModal", 
 
         ]); 
 
       }, 
 

 
       'delete' => function($url, $model) { 
 
        $icon = '<span class="glyphicon glyphicon-trash"></span>'; 
 
        return Html::a($icon, $url, 
 
        [ 
 
         'data-confirm' => "Apakah yakin dihapus ?", 
 
         'data-method' => 'post',  
 
        ]); 
 
       }, 
 
       ] 
 
      ], 
 
     ], 
 
    ]); ?> 
 

 
    <?php \yii\widgets\Pjax::end() ?> 
 
    <?php Pjax::end(); ?> 
 

 
</div> 
 
<?php 
 
Modal::begin(['id' => 'donaturModal',]); 
 
    Pjax::begin(['id'=>'pjax-modal', 'timeout'=>false, 
 
     'enablePushState'=>false, 
 
     'enableReplaceState'=>false,]); 
 

 
    Pjax::end(); 
 
Modal::end(); 
 
?> 
 

 
<?php 
 
$this->registerJs(' 
 
    $("#donaturModal").on("shown.bs.modal", function (event) { 
 
     var button = $(event.relatedTarget) 
 
     var href = button.attr("href") 
 
     $.pjax.reload("#pjax-modal", { 
 
      "timeout":false, 
 
      "url":href, 
 
      "replace":false, 
 
     }); 
 
    }) 
 
');  
 
?> 
 

 
<?php 
 
     Modal::begin([ 
 
     'header' => '<h1 align="center">Tambah Donatur</h1>', 
 
     'id' => 'modal', 
 
     'size' => 'modal-lg', 
 
     ]); 
 

 
     echo "<div id='modalContent'><div>"; 
 
     Modal::end() 
 
?>

代碼AppAsset.php

<?php 
 
/** 
 
* @link http://www.yiiframework.com/ 
 
* @copyright Copyright (c) 2008 Yii Software LLC 
 
* @license http://www.yiiframework.com/license/ 
 
*/ 
 

 
namespace app\assets; 
 

 
use yii\web\AssetBundle; 
 

 
/** 
 
* @author Qiang Xue <qiang.xue@gmail.com> 
 
* @since 2.0 
 
*/ 
 
class AppAsset extends AssetBundle 
 
{ 
 
    public $basePath = '@webroot'; 
 
    public $baseUrl = '@web'; 
 
    public $css = [ 
 
     'css/site.css', 
 
    ]; 
 
    public $js = [ 
 
    'js/main.js', 
 
    ]; 
 
    public $depends = [ 
 
     'yii\web\YiiAsset', 
 
     'yii\bootstrap\BootstrapAsset', 
 
    ]; 
 
}

代碼main.js/JS

$(function(){ 
 
//ambil form untuk tambah data 
 
$("#modalButton").click(function(){ 
 
    $("#modal").modal('show') 
 
      .find("#modalContent") 
 
      .load($(this).attr('value')); 
 
}); 
 
});

Answer 1

形式EnableAjaxValidation：

<?php $form = ActiveForm::begin([ 
    'layout' => 'horizontal', 
    'enableAjaxValidation' => true, 
    'id' => 'create-form', 
    ... 
]); 

控制器

public function actionCreate() 
{ 
    $model = new Donatur(); 
    if ($model->load(Yii::$app->request->post())) { 
     if (Yii::$app->request->isAjax) { 
      Yii::$app->response->format = \yii\web\Response::FORMAT_JSON; 
      return ActiveForm::validate($model); 
     } 
     if($model->save()) { 
      Yii::$app->session->setFlash('success', 'Data berhasil disimpan!'); 
     } 
     else { 
      Yii::$app->session->setFlash('error', 'error message!'); 
     } 
     return $this->redirect(['index']); 
    } else { 
     if (Yii::$app->request->isAjax) { 
      return $this->renderAjax('create', ['model' => $model]); 
     } 
     else{ 
      return $this->render('create', ['model' => $model]); 
     } 
    } 
}