Using Autocomplete Widget

Yii 1.1 General Discussion
1

I have this widget in my admin view:




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

		//'model'=>$model,

		//'attribute'=>'lastName',

		'id'=>'last-name',

		'name'=>'last-name',

		'source'=>$this->createUrl('Engineering/suggestName'),

		'options'=>array(

			'delay'=>100,

			'minLength'=>2,

			'showAnim'=>'fold',

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

				$('#completename').val(ui.item.completename);

				$('#firstname').val(ui.item.firstname);

				$('#middlename').val(ui.item.middlename);

			}"

		),

		'htmlOptions'=>array(

        'size'=>'40'

		),

	));

My questions are:

1.)

Im not sure about the ‘source’ potion…if my admin.php is located “C:\XAMPP\htdocs\ASAES\protected\views\engineering\admin.php” and my controller “C:\XAMPP\htdocs\ASAES\protected\controllers\EngineeringController” should I put there: ‘source’=>$this->createUrl(’…/…/controllers/Engineering/suggestCountry’),????

2.)

Where’s the part that inserts the suggest array data displaying the queried names?

2

The createUrl method’s parameter should be ‘controllerId/actionId’, so


'source'=>$this->createUrl('engineering/suggestCountry'),

That action should be echoing a JSON encoded array of options.

I’m not sure what you mean with your second question.

3

I mean the suggestionbox that appears when i start typing…(Question#2)

4

Are you saying that you’re getting no options in the suggestion box? You should ensure that the ajax request that is being used to build the suggestions is returning the data that you expect.

What does your browser’s console show as the response to the ajax request?

5

The number of suggested response is now exact but it displays nothing (just white spaces but i could click them and select)…??

6

Can you post the current content of your widget call and of the action that should be returning the JSON array?

7

Widget Call:




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

            'name' => 'suggestName',

            'sourceUrl' => array('engineering/suggest'),

            'value' => $model->lastName,

            'options' => array(

                'showAnim' => 'fold',

                //remove if you dont need to store the id, like i do...

                'select' => 'js:function(event, ui){ jQuery("#Daytrip_idNo").val(ui.item["id"]); }'

            ),

            'htmlOptions'=>array(

			'size'=>'40'

			),

    ));

Action:




public function actionSuggest() {

        $criteria = new CDbCriteria;

        $criteria->select = array('lastName', 'firstName', 'MiddleName');

        $criteria->addSearchCondition('lastName', $_GET['term']);

        $criteria->limit = 5;

        $data = Engineering::model()->findAll($criteria);

        $arr = array();

        foreach ($data as $item) {

            $arr[] = array(

                'lastname' => $item->lastName,

                'firstname' => $item->firstName,

                'middlename' => $item->middleName,

            );

		}

        echo CJSON::encode($arr);

	}
8

The array that you return should be single dimensional. I guess you’re looking for something like:




        foreach ($data as $item) {

            $arr[] = $item->lastName;

        }
9

Problem solved! Thats why…my array was multidimensional that the display cant handle.

Thanks for your help!

10

By the way where is the CSS file of this widget…I want to change the display of the suggestionbox.