CJuiAutoComplete loading icon for the user


ive implemented CJuiAutoComplete successfully and now wanted to have kind of LOADING IMAGE showing up for the waiting user.

beforesend and complete seems not to work for this. i usually use this for my ajaxbuttons and work fine. but here doesnt work. any ideas? And what does showAnim => fold mean????

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

                'id' => 'test',

                'name' => 'test',

                'value' => 'test',

                'source' => $this->createUrl('site/test'),

                'options' => array(

                    'showAnim' => 'fold',

                    'beforeSend' => 'js:function(){        

                                        $("#loading").html("LOADING IMAGE HERE");               


                    'complete' => 'js:function(){



                    'select' => 'js:function(event, ui){ 






                'htmlOptions' => array(

                //'style' => 'height:20px;'



solved for the interested:


.ui-autocomplete-loading {

background: white url('../images/loading.gif') right center no-repeat; 


to yout css file works

Thanks, it helped me

Please kindly tell me how u were able to do it.

I created a div called loading. I have tried



but it did not work.

The css file is it like the


specified in the documentation, and how can it be used?

I have browsed for this but couldn’t get something adaptable.

Thanks for any help