phpgridviewyii2

yii2 GridView Search Fields outside Table


I'm using Yii2 Framework and the GridView to display data with a SearchModel, DataProvider and the Filter of the Grid View. I also use Pjax to allow pagination and ordering with Ajax. Works fine so far.

Now I want to set up a search field which is not in the Header of the table. It looks not very good to have only 2 of them, at the last columns. So this is a little bit tricky now. How can I manipulate the post data of the grid? Is there an easy solution? Are there any examples or ideas how to set this up?


Solution

  • For example, i have only one field for filter. Its a date range with two disbled input and calendar widget.

    In view:

    <div class="col-md-4 col-md-offset-8">
                <?php echo $this->render('_filter', [
                    'model' => $filterModel
                ]); ?>
            </div>
            <div class="col-md-12">
                <?php Pjax::begin(['id' => 'order-statistics']); ?>
                <?php echo GridView::widget([
                    'dataProvider'   => $dataProvider,
                    'filterSelector' => '#filter-form .js-date-value',
                    'showFooter'     => true,
                    'columns'        => [ 
    

    In _filter.php:

    $this->registerAssetBundle(DateRangePickerAsset::className());
    
    <?php echo Html::beginTag('div', ['id' => 'filter-form']); ?>
        <div class="input-group">
            <span class="input-group-addon js-date-calendar" title="<?php echo Yii::t('statistics', 'Select date'); ?>"
                  role="button" data-max-date="<?php echo date('Y-m-d', strtotime('+1 day')); ?>">
                <?php echo Html::icon('calendar', ['tag' => 'i']); ?>
            </span>
            <?php echo Html::activeTextInput($model, 'from', [
                'id'       => 'js-date-from',
                'class'    => 'form-control js-date-from js-date-value',
                'readonly' => true
            ]); ?>
            <span class="input-group-addon js-date-remove" title="<?php echo Yii::t('statistics', 'Clear fields'); ?>"
                  role="button">
                <?php echo Html::icon('remove', ['tag' => 'i']); ?>
            </span>
            <?php echo Html::activeTextInput($model, 'to', [
                'id'       => 'js-date-to',
                'class'    => 'form-control js-date-to js-date-value',
                'readonly' => true
            ]); ?>
        </div>
    <?php echo Html::endTag('div');