Autocomplete with caching?

How do we cache the autocomplete result(s) in CJuiAutoComplete?

Basically, my query is if we use the ‘source’ option to specify the javascript callback function (as shown in the jquery-ui website demo, under ‘Remote with caching’), how do we specify the url from where the JSON data has to be collected?

Or is there another way to do it?

Here’s the example at jQueryUI guide: http://jqueryui.com/demos/autocomplete/#remote-with-cache

Yes, that is the link i am referring to in my question also.

My doubt is that generally when we specify ‘sourceUrl’ we can specify the ‘controller/action’ for the URL to collect JSON, but how do we do that when we are giving a javascript callback function as referred in the jquery link example. When i try giving the name of the php file as string, the autocomplete feature does not work…

So, my question is where does yii look for the php file or action method in this case…


=>'js:function(){ … '.$this->createUrl(…).'}'

I had tried this out. It did not work in the beginning. After working a little, I realised that the problem was with the location in which I was trying to initialise the variables ‘cache{}’ and ‘lastXhr’ (from the jquery example). This is what I have done(it is mostly a direct lift from the jquery example):




    $script = 'var cache = {}, lastXhr;';

    Yii::app()->clientScript->registerScript('script-autocomp', $script);

    $this->widget('zii.widgets.jui.CJuiAutoComplete',array(

        'id'=>'autocomp',

        'model'=>$model,

        'attribute'=>'_underGroup',

        'source'=>'js:

            function(request, response) 

            {

                var term = request.term;

                if (term in cache) 

                {

                        response(cache[term]);

                        return;

                }


                lastXhr = $.getJSON("' . $this->createUrl("accountTree/fetchGroupNames") . '", request, function(data, status, xhr) 

                {

                        cache[term] = data;

                        if (xhr === lastXhr) 

                        {

                                response(data);

                        }

                });

            }',

        'options'=>array(

            'minLength'=>'2',

            ),

        'htmlOptions'=>array('size'=>60,'maxlength'=>75, ),

   ));






It is working now. Thanks for the reply!!