php - 使用 Yii CJuiAutoComplete 自动完成其他字段

Question

我有以下情况:

包含一个邮政编码字段和一个城市字段的表单。

我想要在邮政编码字段上自动完成，因此当用户键入例如 1000 时，自动完成值将显示“1000 - Brussels”。然后选择此值时，将在邮政编码字段中填写 1000，并在城市字段中填写布鲁塞尔。

邮政编码、城市和串联信息将来自 mysql 数据库:

我的自动完成功能仅适用于邮政编码，但不知道如何实现所描述的效果(= 填充第二个字段)。

当前表单代码:

<div class="row">
        <?php echo $form->labelEx($model,'PostalCode'); ?>
        <?php //echo $form->textField($model,'PostalCode',array('size'=>10,'maxlength'=>50));

                $this->widget('zii.widgets.jui.CJuiAutoComplete', array(
                'name'=>'PostalCode',
                'value'=>$model->PostalCode,
            //'source'=>$people, // <- use this for pre-set array of values
                'source'=>$this->createUrl('BeCity/GetBelgianPostalCodes'),// <- path to controller which returns dynamic data
                // additional javascript options for the autocomplete plugin
                'options'=>array(
                        'minLength'=>'1', // min chars to start search
                        'showAnim'=>'fold'
                ),
                ));

                ?>
        <?php echo $form->error($model,'PostalCode'); ?>
    </div>

当前 Controller Action 代码:

public function actionGetBelgianPostalCodes()
        {                     
            $res =array();

            if (isset($_GET['term'])) {
                    // http://www.yiiframework.com/doc/guide/database.dao
                    $qtxt ="SELECT
                            DISTINCT
                            bc.PostalCode as PostalCode,
                            bc.NameNL as CityName,
                            CONCAT(bc.PostalCode, ' - ', bc.NameNL) as FullCityName
                            FROM be_city bc
                            WHERE bc.PostalCode LIKE :qterm
                            ORDER BY bc.PostalCode, bc.NameNL ASC";
                    $command =Yii::app()->db->createCommand($qtxt);
                    $command->bindValue(":qterm", $_GET['term'].'%', PDO::PARAM_STR);
                    $res =$command->queryColumn();
            }

            echo CJSON::encode($res);
            Yii::app()->end();
        }

不确定 Controller 操作是否完全正确，$command->queryAll() 似乎不起作用所以我改用 queryColumn() 但它只返回第一列？

有什么提示吗？

另外，还有一个问题，我希望指向 Controller 操作的链接是动态的。如果用户在之前的国家/地区下拉列表中选择了比利时，则应调用“BeCity/GetBelgianPostalCodes”。如果是法国，则应该是“FrCity/GetFrenchPostalCodes”。这可能吗？如何实现？

谢谢

Answer 1

这是我找到的方式(我根据您的应用程序进行了调整，所以我希望没有打字错误...)我还将小部件的名称更改为 myPostCode 最好保留 Yii 给出的默认名称:

<?php
        $this->widget('zii.widgets.jui.CJuiAutoComplete', array(
        'name'=>'myPostCode',
        'value'=>$model->PostalCode,
        'source'=>$this->createUrl('BeCity/GetBelgianPostalCodes'),
        'options'=>array(
                'minLength'=>'1', // min chars to start search
                'showAnim'=>'fold'
                //focus option will tell what is displayed in field during the selection
                'focus'=> 'js:function( event, ui ) {
                    $( "#myPostCode" ).val( ui.item.postalcode );
                    return false;
                }',
                //select function will tell where go each field
                'select'=>'js:function( event, ui ) {
                    $( "#myPostCode" ).val( ui.item.postalcode );
                    $( "#CityName" ).val(ui.item.cityname);
                    return false;
                }'
        ),
        ));

//Here is the code for the display.
//This code MUST be AFTER the widget
//It should be possible to include it in the widget but I do not know how.
// You may change the line "<a>"+item.postalcode... with what you want to display but must keep the a tag."

    Yii::app()->clientScript->registerScript('input', '
        $("#myPostCode").data("autocomplete")._renderItem = function( ul, item ) {
        return $( "<li></li>" )
    .data( "item.autocomplete", item )
    .append( "<a>"+item.postalcode + " - " + item.cityname+"</a>")
    .appendTo( ul );
    };');

?>

您还需要更改查询以返回所有数据

$res =$command->queryAll();