Question

我有此表单字段：

echo $this->Form->control('customer', ['id' => 'Autocomplete', 'empty' => false, 'required' => true]);

我正在尝试通过db搜索实现自动完成功能。这是jQuery代码：

<script type="text/javascript">
    $("#Autocomplete").keyup(function(){
        $(this).val($(this).val().toLowerCase());
    });
</script>

<script type="text/javascript">
    $( function() {            

        $( "#Autocomplete" ).autocomplete({
            minLength: 1,
            source: function( request, response ) {
                $.ajax({
                    url: '/app/tasks/getAll',
                    dataType: 'json',
                    data:{
                        text : $('#Autocomplete').val()
                    },
                    success: function (data)
                    {
                        var lenlen=data.length;
                        var res=[];
                        for(var i=0;i<lenlen;i++){
                                res[i]=data[i].company;
                                //console.log(data[i].company);
                        }
                        response( $.map( data, function( item )
                        {
                            console.log(item.company);
                            return{

                                    label: item.company,
                                    value: item.company,
                                    id: item.company
                                   }
                        }));
                    }
                });
            },
            select: function( event, ui ) {
               event.preventDefault(); 
               $('#Autocomplete').val(ui.item.label);
           },
        });
    });

    // A custom jQuery method for placeholder text:

    $.fn.defaultText = function(value){

        var element = this.eq(0);
        element.data('defaultText',value);

        element.focus(function(){
            if(element.val() == value){ 
                element.val('').removeClass('defaultText');
            }
            }).blur(function(){ 
            if(element.val() == '' || element.val() == value){ 
                element.addClass('defaultText').val(value);
            }
        });

        return element.blur();
    }

这是控制器中用于搜索数据库的代码：

public function getAll() {


            $this->viewBuilder()->layout(false);
            $this->autoRender = false;

            $data = $this->request->getQuery('text'); 

            $results = TableRegistry::get('Customers')->find('all', ['fields' => ['id', 'company', 'name', 'surname'], 
                'conditions' => [
                    'OR' => [
                        'LOWER(name) LIKE' => '%'.$data.'%',
                        'LOWER(company) LIKE' => '%'.$data.'%',
                        'LOWER(surname) LIKE' => '%'.$data.'%'
                    ]
                ]]);
            $response = array();
            $i = 0;
            foreach($results as $result){
                $response[$i]['id'] = $result['id'];
                $response[$i]['company'] = $result['company'];

                $i++;

            }

           echo json_encode($response);

    }

但是，虽然我可以看到从console.log的数据库中正确获取了结果，但结果并没有显示在下拉列表中以选择其中之一。仅当我通过模式加载表单时，该结果才起作用如果我直接打开表单，那么自动完成功能会起作用

我该如何解决？

编辑

打开表单时，我也收到此错误：

toolbar.js？1550138303：83 [Deprecation]同步XMLHttpRequest在不赞成使用主线程，因为它不利于最终用户的体验。如需更多帮助，请检查 https://xhr.spec.whatwg.org/。

jQuery自动完成：带来结果但不显示结果（以模式显示）

0 个答案: