I made changes to both my index view and search model: Am using Kartik’s select 2 widget for the dropdown filter and the daterange filter for the date filter.
this is how my search model looks like:
public function search($params)
{
$query = Contributions::find();
$query->joinWith(['member']);
$dataProvider = new ActiveDataProvider([
'query' => $query,
]);
$this->load($params);
if (!$this->validate()) {
// uncomment the following line if you do not want to any records when validation fails
// $query->where('0=1');
return $dataProvider;
}
$query->andFilterWhere([
'contributionid' => $this->contributionid,
'amount' => $this->amount,
]);
$query->andFilterWhere(['like', 'members.memberid', $this->memberid]);
$query->andFilterWhere(['like', 'comment', $this->comment]);
if(isset($this->date) && $this->date!=''){
$date_explode = explode("TO", $this->date);
$date1 = trim($date_explode[0]);
$date2= trim($date_explode[1]);
$query->andFilterWhere(['between', 'date', $date1,$date2]);
}
return $dataProvider;
}
below is my index view file:
<?php
use yii\helpers\Html;
//use yii\grid\GridView;
use kartik\grid\GridView;
/* @var $this yii\web\View */
/* @var $searchModel frontend\models\ContributionsSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */
$this->title = ‘Contributions’;
$this->params[‘breadcrumbs’][] = $this->title;
?>
<div class="contributions-index">
<h1><?= Html::encode($this->title) ?></h1>
<?php // echo $this->render('_search', ['model' => $searchModel]); ?>
<p>
<?= Html::a('Create Contributions', ['create'], ['class' => 'btn btn-success']) ?>
</p>
<?php
use frontend\models\Members;
$members= Members::find()->all();
use yii\helpers\ArrayHelper;
$items= ArrayHelper::map($members, 'memberid', 'name');
// Generate a bootstrap responsive striped table with row highlighted on hover
$gridColumns=[
['class' => 'kartik\grid\SerialColumn'],
[
'vAlign'=>'middle',
'width'=>'180px',
'value'=>'member.name',
'attribute' => 'memberid',
'filter'=>ArrayHelper::map(Members::find()->orderBy('name')->asArray()->all(), 'memberid', 'name'),
'filterType' => GridView::FILTER_SELECT2,
'filterWidgetOptions'=>[
'pluginOptions'=>['allowClear'=>true],
],
'filterInputOptions'=>['placeholder'=>'Select Member'],
'format'=>'html',
],
[
'class' => '\kartik\grid\DataColumn',
'attribute' => 'amount',
'format'=>['decimal',2],
'pageSummary' => true
],
'comment',
[
'attribute' => 'date',
'format'=>'date',
'filterType'=> \kartik\grid\GridView::FILTER_DATE_RANGE,
'filterWidgetOptions' => [
'presetDropdown' => true,
'pluginOptions' => [
'format' => 'YYYY-MM-DD',
'separator' => ' TO ',
'opens'=>'left',
] ,
'pluginEvents' => [
"apply.daterangepicker" => "function() { apply_filter('date') }",
]
],
],
['class' => 'kartik\grid\ActionColumn']
];
echo GridView::widget([
'dataProvider'=> $dataProvider,
'filterModel' => $searchModel,
'filterRowOptions'=>['class'=>'kartik-sheet-style'],
'columns' => $gridColumns,
'responsive'=>true,
'resizableColumns'=>true,
'floatHeader'=>true,
'showPageSummary' => true,
'hover'=>true,
'pjax'=>true,
'pjaxSettings'=>[
'neverTimeout'=>true,
]
]);
?>
</div>
<script type="text/javascript">
function apply_filter() {
$(’.grid-view’).yiiGridView(‘applyFilter’);
}
</script>
This may not be the most efficient implementation but it works and I would like to get more information and suggestions on this too. The javascript function at the end of the index view file helps to reload the grid once a selection of daterange is changed.Hope this helps