编程语言
首页 > 编程语言> > php-如何将模型数据加载到在Yii中使用Ajax过滤的Select2下拉列表中

php-如何将模型数据加载到在Yii中使用Ajax过滤的Select2下拉列表中

作者:互联网

我在视图中使用以下select2 Yii小部件来填充下拉列表.由于准备选择列表所需的数据由超过2K条记录组成,因此我使用带有minimumInputLength参数的select2和ajax查询来根据用户输入生成列表的部分结果.如果我创建一个新记录,我将没有任何问题.它可以很好地填充所有内容,并且可以将数据保存到数据库中.但是,我不知道在更新操作期间如何将保存的数据加载回该下拉菜单.我在某处阅读了用于此目的的initselection,但我不知道如何使用它.

有人可以帮我吗?

我的观点:

$this->widget('ext.select2.ESelect2', array(
            'selector' => '#EtelOsszerendeles_osszetevo_id',
            'options'  => array(
                    'allowClear'=>true,
                    'placeholder'=>'Kérem válasszon összetevőt!',
                    'minimumInputLength' => 3,
                    'ajax' => array(
                            'url' => Yii::app()->createUrl('etelOsszerendeles/filterOsszetevo'),
                            'dataType' => 'json',
                            'quietMillis'=> 100,
                            'data' => 'js: function(text,page) {
                                            return {
                                                q: text,
                                                page_limit: 10,
                                                page: page,
                                            };
                                        }',
                            'results'=>'js:function(data,page) { var more = (page * 10) < data.total; return {results: data, more:more }; }',
                    ),
            ),
          ));?>

我的控制器的动作过滤器:

public function actionFilterOsszetevo()
{
    $list = EtelOsszetevo::model()->findAll('nev like :osszetevo_neve',array(':osszetevo_neve'=>"%".$_GET['q']."%"));
    $result = array();
    foreach ($list as $item){
        $result[] = array(
                'id'=>$item->id,
                'text'=>$item->nev,
        );
    }
    echo CJSON::encode($result);
}

解决方法:

我使用initSelection以这种方式加载现有记录以进行更新(我将您的某些视图代码替换为…以关注主要更改).用Yii 1.1.14测试.本质上,我使用了两个不同的ajax调用:

视图:

<?php

$this->widget('ext.select2.ESelect2', array(
        'selector' => '#EtelOsszerendeles_osszetevo_id',
        'options'  => array(
                ...
                ...
                'ajax' => array(
                        'url' => Yii::app()->createUrl('client/searchByQuery'),
                        ...
                        ...
                        'data' => 'js: function(text,page) {
                                        return {
                                            q: text,
                                            ...
                                        };
                                    }',
                        ...
                ),
                'initSelection'=>'js:function(element,callback) {
                   var id=$(element).val(); // read #selector value
                   if ( id !== "" ) {
                     $.ajax("'.Yii::app()->createUrl('client/searchById').'", {
                       data: { id: id },
                       dataType: "json"
                     }).done(function(data,textStatus, jqXHR) { callback(data[0]); });
                   }
                }',
        ),
      ));
?>

现在在您的控制器中,您应该收到用于进行ajax处理的参数:插入时作为字符串的查询(q); id(id)在更新时为int.在$_GET中读取时,参数名称必须与ajax数据参数相同(在此示例中,插入q;在更新ID中).代码未重构/优化:

控制器:

 public function actionSearchByQuery(){
        $data = Client::model()->searchByQuery( (string)$_GET['q'] );
        $result = array();
        foreach($data as $item):
           $result[] = array(
               'id'   => $item->id,
               'text' => $item->name,
           );
        endforeach;
        header('Content-type: application/json');
        echo CJSON::encode( $result );
        Yii::app()->end(); 
 }

 public function actionSearchById(){
        $data = Client::model()->findByPk( (int) $_GET['id'] );
        $result = array();
        foreach($data as $item):
           $result[] = array(
               'id'   => $item->id,
               'text' => $item->name,
           );
        endforeach;
        header('Content-type: application/json');
        echo CJSON::encode( $result );
        Yii::app()->end(); 
 }

模型-自定义查询和一些订单/安全/清洁:)

 public function searchByQuery( $query='' ) {
        $criteria = new CDbCriteria;
        $criteria->select    = 'id, ssn, full_name';
        $criteria->condition = "ssn LIKE :ssn OR full_name LIKE :full_name";
        $criteria->params = array (
            ':ssn' => '%'. $query .'%',
            ':full_name' => '%'. $query .'%',
        );
        $criteria->limit = 10;
        return $this->findAll( $criteria );
 }

编辑:

当使用传统的HTTP Post预加载更新时(同步,例如使用Yii生成的表单),它可以立即使用.对于异步/ Ajax更新,例如使用JQuery:

事件/触发:

$('#button').on("click", function(e) {
        ...  
        ... your update logic, ajax request, read values, etc
        ...
        $('#select2_element').select2('val', id_to_load );
});

这样,initSelection将以新的id_to_load值以异步方式再次运行,并按id重新加载记录.

根据您的情况和您的需要,initSelection可以完全不同,以避免从db或you can use formatResult and formatSelection custom functions (are described in Load Remote Data sample source code)加载记录.阅读文档,我了解到initSelection的回调需要具有id和text元素的JSON数据才能正确加载,或者您可以尝试合并两个概念(使用您的自定义JS事件/触发调用执行此initSelection)(未测试):

       'initSelection'=>'js:function(element,callback) {
                   // here your code to load and build your values,
                   // this is very basic sample 
                   var id='myId'; 
                   var text='myValue'; 
                   data = {
                     "id": id,
                     "text": text
                   }
                   callback(data);                       
        }',

或直接在触发呼叫上:

$('#button').on("click", function(e) {
        ...  
        ...             ...
        $("#select2_element").select2("data", {id: "myId", text: "MyVal"});
});

希望能有所帮助.

标签:ajax,jquery-select2,yii,php,jquery
来源: https://codeday.me/bug/20191029/1961775.html