2017-08-02 58 views
0

我是codeignitor的新手,試圖從數據庫中獲取jquery autocomplete。已經有很多關於這個話題的問題,但沒有一個幫助我。jquery自動完成不會給任何結果

這裏是視圖文件我的腳本功能

查看

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"> 
</script> 
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" /> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"> 
</script> 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery- 
ui.css" /> 
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"> 
</script> 
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 



<script type="text/javascript"> 
    $(function() { 
     $("#vname").autocomplete({ 
    source: function(request, response) { 

     $.ajax({ 
     url: "vendor/search", 
     data: { term: $("#vname").val()}, 
     dataType: "json", 
     type: "GET", 
     success: function(data){ 
      var resp = $.map(data,function(obj){ 
       return obj.tag; 
      }); 

      response(resp); 
     } 
    }); 
}, 
minLength: 2 
    }); 
    }); 
    </script> 
    </head> 
    . 
    . 
    . 
    . 
    <input type="text" class="form-control" name="vendor_name" id="vname" /> 

這裏控制器(供應商)函數(搜索),從中我試圖從數據庫

獲得建議的陣列

控制器

public function search() 
{ 

$json = []; 

    $this->load->database(); 
    if(!empty($this->input->get("term"))){ 
     $this->db->like('name', $this->input->get("term")); 
     $query = $this->db->select('id,name as text') 
        ->limit(10) 
        ->get("vendors"); 
     $json = $query->result(); 
    } 
    echo json_encode($json);   
} 

問題是,當我輸入字段時,什麼都沒有發生(沒有自動完成出現),但我的供應商/搜索功能正常工作,而直接訪問它並傳遞一些東西作爲參數。我認爲$_GET[term]總是空的或什麼的。

我沒有任何想法現在應該做什麼,任何建議將是可觀的。

+0

相反,如果get()可能試圖控制器上的post()和ajax類型:「POST」, – user4419336

+1

我已經試過了。沒有工作 – Whoosis

+1

嘗試從Ajax請求中刪除''dataType:「json」,''請求 –

回答

0

變化控制器

public function search(){ 
    $json = []; 
    $this->load->database(); 
    if(!empty($this->input->get("term"))){ 
     $this->db->like('name', $this->input->get("term")); 
     $query = $this->db->select('id,name as text') 
        ->limit(10) 
        ->get("vendors"); 
     $json = $query->result(); 
    } 
    //set page header 
    $this->output 
     ->set_content_type('application/json') 
     ->set_output(json_encode($json)); 
} 

取代script標籤

<script type="text/javascript"> 
$(function() { 
    $("#vname").autocomplete({ 
    source: function(request, response) { 
     $.ajax({ 
     url: "<?=base_url(); ?>vendor/search?term="+request.term, 
     dataType: "json", 
     type: "GET", 
     success: function(data){ 
      response($.map(data, function (value, key) { 
      return { 
       label: value.text, 
       value: value.id 
      } 
      })); 
     } 
     }); 
    }, 
    minLength: 2, 
    select: function(event, ui) { 
     //select event of autocomplete 
     console.log("id : ",ui.item.value); 
     console.log("text : ",ui.item.label); 
     $('#vname').val(ui.item.label); 
     return false; 
    }, 
    }); 
}); 
</script> 
0

改變這一行:

url: "vendor/search", 

到:

url: "<?php echo base_url('vendor/search'); ?>",