Typeahead with database as source

This snippet works and it correctly sets data from Table Product and column name as input for bootstrap typeahead extension for YII.

but, I have ended up writing a SELECT ALL from Table Product which is having large number of data.

Can we modify this so that a WHERE condition can be added to the DataProvider on user input event. Based on each alphabet entered, a new query could then be fired and only a subset of data retrieved?

            <?php 
            $dataProvider = new CActiveDataProvider('Product');

            $dataArray = $dataProvider->getData();
            $myarray = array();

            foreach ($dataArray as $data){
                array_push($myarray, CHtml::encode($data->name));
            }               


            $this->widget('bootstrap.widgets.TbTypeahead', array(
                'name'     => 'typeahead',
                'options'=>array(
                    'name'=>'typeahead',
                    'source'=>$myarray,
                    'items'=>4,
                    'matcher'=>"js:function(item) {
                        return ~item.toLowerCase().indexOf(this.query.toLowerCase());
                    }",
                ),
                'htmlOptions'=>array('class'=>'search-query span3', 'placeholder'=>"Search" ), 
            )); ?>  

Once you start to supply a function to source, then you have the power to manipulate what happens, including how often you send requests.

minLength: 3, // <- custom option
source: function(query, process) {
    var longEnough = query.length >= this.options.minLength;
    // you can create custom variables (this.search) that a remembered across
    //  searches
    if (longEnough && (! this.search || whateverRuleYouWantToLimitBy)) {
        // remember the query so that you can compare it to the next one
        this.search = query;
        $.ajax({
            url: '/ajaxsearch.php?value=' + query,
            type: "GET",
            success: process
        });
    }
}

I have some code that does something similar, and I cache the results returned by the Ajax code, and then I see if the new query string has the potential to change the results (e.g., if you limit by 4 results, but I only have 3 results, then a query that simply adds to the last query (search) has no need to hit the server).

Alternatively, you can kick off a timer that effectively waits for the user to stop typing to avoid the behavior of hitting the server for every key press. Technically, that results in slower feedback, but it's better for the server and mobile users. This is appropriate on sites that have a lot of traffic.