自動使用完整的搜索MySQL的AJAX笨不工作

Question

控制器：test.php的

<?php 
    defined('BASEPATH') OR exit('No direct script access allowed'); 
    class Test extends CI_Controller 
    { 
     function __construct() 
     { 
      parent :: __construct(); 
      $this->load->helper(array('form', 'url', 'captcha', 'email')); 
      $this->load->model('Fetch_data'); 
     } 
     public function index() 
     { 
      $this->load->view('index',$data);   
     } 
     public function lookup() 
     { 
      $keyword = $this->input->post('term'); 
      $data['response'] = 'false'; 
      $query = $this->Fetch_data->lookup($keyword); 
      if(! empty($query)) 
      { 
       $data['response'] = 'true'; 
       $data['message'] = array(); 
       foreach($query as $row) 
       { 
        $data['message'][] = array(  
              'college_name' => $row->college_name 
             ); 
       } 
      } 
      if('IS_AJAX') 
      { 
       echo json_encode($data); 
      } 
      else 
      { 
       $this->load->view('index',$data); 
      } 
     } 
    } 

view.php

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css" type="text/css" media="all" /> 
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js" type="text/javascript"></script> 
<style> 
    .ui-menu { 
     list-style:none; 
     padding: 2px; 
     margin: 0; 
     display:block; 
    } 
    .ui-menu .ui-menu { 
     margin-top: -3px; 
    } 
    .ui-menu .ui-menu-item { 
     margin:0; 
     padding: 0; 
     zoom: 1; 
     float: left; 
     clear: left; 
     width: 100%; 
     font-size:80%; 
    } 
    .ui-menu .ui-menu-item a { 
     text-decoration:none; 
     display:block; 
     padding:.2em .4em; 
     line-height:1.5; 
     zoom:1; 
    } 
    .ui-menu .ui-menu-item a.ui-state-hover, 
    .ui-menu .ui-menu-item a.ui-state-active { 
     font-weight: normal; 
     margin: -1px; 
    } 
</style> 

<script type="text/javascript"> 
    $(this).ready(function() { 
     $("#colleges").autocomplete({ 
      minLength: 1, 
      source: 
      function(req, add){ 
       $.ajax({ 
        url: "<?php echo base_url(); ?>index.php/test/lookup", 
        dataType: 'json', 
        type: 'POST', 
        data: req, 
        success:  
        function(data){ 
         if(data.response =="true"){ 
          add(data.message); 
          console.log(data); 
         } 
        }, 
       }); 
      }, 

     }); 
    }); 
</script> 
<input type="text" name="colleges" id="colleges" class="form-control" placeholder="Colleges and Universities" /> 
<ul> 
    <div class="well" id="result"></div> 
</ul> 

型號：

public function lookup($keyword) 
    { 
     $this->db->select('college_name,state,field')->from('all_colleges'); 
     $this->db->like('college_name',$keyword,'after'); 
     $this->db->or_like('state',$keyword,'after'); 
     $query = $this->db->get(); 
     $result = $query->result_array();  
     return $result; 
    } 

在這段代碼我想創建自動填充建議框。現在，我正在創建具有功能名稱查找的測試控制器，這是查看頁面中腳本調用的。在這裏，當我在文本框中寫東西時，它看起來像。

我怎樣才能解決這個問題？

Answer 1

我不太確定。但是我發現在構建的陣列中出現了錯誤。在查看試試這個控制器中，

if(! empty($query)) 
     { 
      $data['response'] = 'true'; 
      $data['message'] = array(); 
      $data['auto_com'] = array(); 
      foreach($query as $row) 
      { 
       $data['message'][] = array(  
             'college_name' => $row->college_name 
            ); 
       $data['auto_com'][] = $row->college_name; 
      } 
     } 
     if('IS_AJAX') 
     { 
      echo json_encode($data['auto_com']); 
     } 
     else 
     { 
      $this->load->view('index',$data); 
     } 

<script type="text/javascript"> 
$(this).ready(function() { 
    $("#colleges").autocomplete({ 
     source: "<?php echo base_url(); ?>index.php/test/lookup"    
    }); 
}); 
</script> 

Answer 2

阿賈克斯只需要返回數據，並且它不需要視圖。你的if函數是錯誤的，因爲Ajax在你的索引方法中執行。如果你想通過AJAX的變量，你必須使用這個，而不是你的數據：

data: { 
    term: //some data 
}, 

這使得$this->input->post('term');可用。還有一件事是你的功能

  function(req, add){ 
       $.ajax({ 
        url: "<?php echo base_url(); ?>index.php/test/lookup", 
        dataType: 'json', 
        type: 'POST', 
        data: req, 
        success:  
        function(data){ 
         if(data.response =="true"){ 
          add(data.message); 
          console.log(data); 
         } 
        }, 
       }); 
      }, 

你必須調用它來執行一個動作，你只是聲明它，但還沒有調用它。