2015-10-03 11 views
7

Vorrei aprire una modale quando clicco su un pulsante all'interno della vista griglia. è possibile con yii2 gridview?Pop-up modale in vista griglia in 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'], 
     ], 
    ]); ?> 

in vista Griglia sopra voglio un modale popup quando clicco sul pulsante 'Dettagli'.

grazie,

risposta

9

Sì, è possibile. per ottenere questo segui i passaggi seguenti.

Aggiungere Modal codice sopra GridView codice.

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

Quindi aggiungere id nel pulsante dettagli. Come come,

[ 
    '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' 
], 

E di registrare JavaScript nella parte superiore o inferiore della pagina di visualizzazione.

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

hey solo corpo modale sta rivelando senza intestazione e piè di pagina non – Bloodhound

+1

per l'aggiunta di intestazione e piè vedono questo http://www.yiiframework.com/doc-2.0/yii-bootstrap-modal.html – GAMITG

+0

@Bloodhound - forse hai visto la (altra) risposta di Eignart Onkel e/o sei stato aiutato dalla risposta di GAMITG al tuo commento, ma in caso contrario, la risposta di Eignart (che potrebbe essere rimossa) suggerisce di cambiare 'find ('. modal-content')' per 'find ('. modal-body')'. –