Text Input Filter


I want to have a text input filter above my Grid. I don’t want to use the grid filter column by column, I just want to have one input text that would search/filter for everything.

How can I do that?


how your filter should work exactly ?

You could do something like this with your search method:

    public function search($params)


        $query = Model::find();

        $dataProvider = new ActiveDataProvider([

            'query' => $query,


        if (!($this->load($params) && $this->validate())) {

            return $dataProvider;


        $query->orFilterWhere(['attribute1' => $this->search])

                ->orFilterWhere(['attribute2' => $this->search])

                ->orFilterWhere(['attribute3' => $this->search])

                ->orFilterWhere(['attribute4' => $this->search])

                ->orFilterWhere(['attribute5' => $this->search]);

        return $dataProvider;


So idea is to compare only one value to several attributes.

But how should I do in the view? That’s really the problem that I’m having.

In GridView set ‘filter’ => false for every column except one where you want the filter.

Use this column’s attribute instead $this->search in data provider example.

Bizley I did that and it works perfect but I don’t want that filter in the grid. I want to create a text input above the grid so it look nicer.

I see. I have not tried this but it should work:

Add input field above the grid with id of your choice and name matching the “searchable” attribute (‘search’ in example above) and add ‘filterSelector’ option in GridView pointing that id.

'filterSelector' => '#search',

Thanks for the help but it didn’t work. The grid refresh but doesn’t load any result.

Also when I check the post parameters it doesn’t include the value of my text input.

Any other recommendation?

I’m replying on my phone so I can’t post code…

if you create a new crud and choose listview instead of gridview it will put the search above the list by default. I believe you can take what you have and replace the list view with the gridview and it should work as you want.

It works but make sure it is not overwritten by the Grid filter of the same name. So do this for example:

<input name="Model[name]" id="searchModel">

<?= GridView::widget([

    'dataProvider' => $dataProvider,

    'filterModel'  => $searchModel,

    'filterSelector' => '#searchModel',

    'columns'      => [


            'attribute'          => 'name',

            'filter' => false, // false here so filter field will not appear for this attribute


// .....

Thanks for the help but it didn’t work either + it refreshes the entire page instead of just refreshing the grid with pjax. I feel that I’m almost close with the first solution but something is still missing :confused:

You are doing something wrong. I have just tested it with Pjax and it works fine. Please share your code.

I’m getting this error now:

Getting unknown property: app\models\search\LocationSearch::search

This is my Search Model:

$query->orFilterWhere(['name' => $this->search])

        	->orFilterWhere(['unit' => $this->search])

        	->orFilterWhere(['address' => $this->search])

        	->orFilterWhere(['suburb' => $this->search])

        	->orFilterWhere(['postalcode' => $this->search]);

This is my view:

<input name="Model[name]" id="searchModel">

My grid: ‘filterSelector’ => ‘#searchModel’,

I just checked and it only finds the name if my input is this:

<input name="LocationSearch[name]" id="searchModel">

so it’s only finding the name. If I change the input to:

<input name="LocationSearch[address]" id="searchModel">

than it finds the address but again, I want 1 input that searches everything, address and name.

I found the solution @Bizley and @skworden. Thanks for the help.

This is what I needed in my Search model:

if ($this->name) {