yii2 GridView Search Fields outside Table

Question

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 an Search Field wich is not in the Header of the Table. It looks not very good to have only 2 of them, at the last columsn. So this is a little bit tricky now. How can i manipluate the Post Data of the Grid? Is there an easy Solution? Are there any Examples or Ideas how to set this up?

Answer 1

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');