Yii2モーダルウィンドウのフォーム

Question

Yii2のモーダルウィンドウからフォームを操作する方法の基礎を理解したいと思いますか？これは私の現在の理解であり、誰かが私が逃したことを私に説明することができれば、感謝しています。 私はレコードを持つListViewを持っています。各レコードにはボタンが含まれています。このボタンは、フォーム付きのモーダルを開きます。

echo Html::a('<span class="glyphicon glyphicon-bell" aria-hidden="true"></span>', ['#'],[ 
         'id' => $model->id, 
         'class' => 'linkbutton', 
         'data-toggle'=>'modal', 
         'data-tooltip'=>'true', 
         'data-target'=>'#submit_vote'.$model->id, 
         'title'=> 'Assign' 
        ]); 

       Modal::begin([ 
        'size' => 'modal-lg', 
        'options' => [ 
         'id' => 'submit_vote'.$model->id, 
        ], 
        'header' => '<h2>Create Vote</h2>', 
        'footer' => 'Footer' 
       ]); 

       ActiveForm::begin([ 
        'action' => 'vote/vote', 
        'method' => 'post', 
        'id' => 'form'.$model->id 
       ]); 

       echo Html::input(
         'type: text', 
         'search', 
         '', 
         [ 
          'placeholder' => 'Search...', 
          'class' => 'form-control' 
         ] 
       ); 

       echo Html::submitButton(
         '<span class="glyphicon glyphicon-search"></span>', 
         [ 
          'class' => 'btn btn-success', 
         ] 
       ); 
       ActiveForm::End(); 
       Modal::end(); 

フォームでは、私は投票/投票とメソッド投稿を書いています。だから、私はVoteControllerのactionVote関数の中に投稿データがあると思います。

$('form').on('submit', function() { 
    alert($(this).attr('id')+$(this).attr('action')+$(this).serialize()); //just to see what data is coming to js 
    if($(this).attr('id') !== 'searchForm') { //some check 
      $.ajax({ 
      url: $(this).attr('action'), 
      type: 'post', 
      data: $(this).serialize(), 
      success: function(){ 
       $("#submit_vote15").modal('hide'); //hide popup 
      }, 
     }); 
     return false; 
    } 

しかし、送信フォーム上のクリックした後、私は2回の警告を参照してください。私はAJAXを使用して送信するため

public function actionVote() 
    { 
     if (Yii::$app->request->post()) { 
     $id = Yii::$app->request->post('search'); 
     Yii::$app->session->setFlash('error', $id); 
     return true; 
     } 
    } 

。モーダルも隠されていない。フラッシュメッセージも表示されません。 私は間違っていますか？誰もが明確にデータフローのステップ手順を説明できますか？今のところ私の理解は：

1. Open Modal;
2. をクリックします。
3. ajaxを介してコントローラアクションにデータをロードします。
4. 投稿のデータをキャッチしてコントローラアクションコードを実行します。 私が逃したものは？

Answer 1

最初に送信イベントで使用していますので、yiiはイベントとブラウザをもう一度起動します（アラートが2回表示される理由）。beforeSubmitイベントを使用する必要があります。第2に、メッセージを表示しないのは、コントローラーで設定し直したからです。便利なリンクがthis

Answer 2

であるあなたが

$(".modal").modal('hide'); 

にコードを変更する必要がありますモーダル

を閉じるにはあなたが単にステップの下に従うことができる...

STEP1：

<?php echo Html::a('<span class="glyphicon glyphicon-comment"></span>', 
        ['/feed/mycomment','id' => $model->id], 
        [ 
         'title' => 'View Feed Comments', 
         'data-toggle'=>'modal', 
         'data-target'=>'#modalvote', 
        ] 
        ); 
?> 

のようなあなたのリンクボタンを定義します

step2：ポップアップウィンドウを定義する（リモートURL）

<div class="modal remote fade" id="modalvote"> 
     <div class="modal-dialog"> 
      <div class="modal-content loader-lg"></div> 
     </div> 
</div> 

STEP3：

public function actionMyComment() 
{ 
     $model = new MyComment(); 
     return $this->renderAjax('_add_comment', [ 
       'model' => $model, 
     ]); 

} 

STEP4のようなあなたのコントローラでリモートURLアクションを定義します。そのだというビューファイル_add_comment

<?php 
use yii\helpers\Html; 
use yii\bootstrap\ActiveForm; 
?> 
    <?php $form = ActiveForm::begin([ 'enableClientValidation' => true, 
       'options'    => [ 
        'id'  => 'dynamic-form' 
       ]]); 
       ?> 

     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
     <h4 class="modal-title">Add Comment</h4> 
     </div> 
     <div class="modal-body"> 
      <?php echo $form->field($model, 'name')->textInput(['maxlength' => true]) ?> 
      <?php echo $form->field($model, 'email')->textInput(['maxlength' => true]) ?> 
      <?php echo $form->field($model, 'comment')->textArea() ?> 
     </div> 
     <div class="modal-footer"> 
     <?php echo Html::submitButton(Yii::t('backend', 'Send'), ['class' => 'btn btn-success']) ?> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
     <?php ActiveForm::end(); ?> 

を定義... :)