2015-10-03 13 views
7

グリッドビュー内のボタンをクリックするとモーダルがポップアップします。これはyii2 gridviewで可能ですか?私はボタン「詳細」をクリックすると、モーダルポップアップしたい上記のグリッドビューでモーダルポップアップでyii2のグリッドビュー

<?= GridView::widget([ 
     'dataProvider' => $dataProvider, 
     'filterModel' => $searchModel, 
     'columns' => [ 
      ['class' => 'yii\grid\SerialColumn'], 


      'time_zone', 
      'no_of_users', 
      'bill_name', 
      'bill_address', 
      'names.name', 
      'bill_state', 
      'bill_city', 
      'bill_postal', 
      'bill_mobile', 

      ['header'=>'Plan Info', 
      'value'=> function($data) 
        { 
         //~ print_r($data);die(); 
         return Html::a(Yii::t('app', ' {modelClass}', [ 
          'modelClass' => 'details', 
         ]), ['userdetails/plans','id'=>$data->id], ['class' => 'btn btn-success '] 

         );  
        }, 
      'format' => 'raw' 
      ], 



      ['class' => 'yii\grid\ActionColumn'], 
     ], 
    ]); ?> 

おかげで、

答えて

9

はい、それは可能です。これを達成するために以下のステップに従う。

GridViewコードの上にModalコードを追加します。

<?php 
    yii\bootstrap\Modal::begin(['id' =>'modal']); 
    yii\bootstrap\Modal::end(); 
?> 

その後、詳細ボタンにidを追加します。

[ 
    'header'=>'Plan Info', 
    'value'=> function($data) 
       { 
        return Html::a(Yii::t('app', ' {modelClass}', [ 
          'modelClass' => 'details', 
          ]), ['userdetails/plans','id'=>$data->id], ['class' => 'btn btn-success', 'id' => 'popupModal']);  
       }, 
    'format' => 'raw' 
], 

とビュー・ページの上部または下部にはJavaScriptを登録するよりも、などのように。

$this->registerJs("$(function() { 
    $('#popupModal').click(function(e) { 
    e.preventDefault(); 
    $('#modal').modal('show').find('.modal-content') 
    .load($(this).attr('href')); 
    }); 
});"); 
+0

ちょっとだけモーダル体は、ヘッダとフッタを追加するためのヘッダとフッタない – Bloodhound

+1

を示していないがhttp://www.yiiframework.com/doc-2.0/yii-bootstrap-modal.html – GAMITG

+0

@Bloodhoundこの参照しますおそらくあなたはEignart Onkelによる(他の)答えを見ていて、あなたのコメントへのGAMITGの返答によって助けられましたが、そうでない場合、Eignartの答えは(削除されるかもしれません) 'find( 'modal-content' find( '。modal-body') 'を実行する。 –