使用Ajax在CodeIgniter中使用来自数据库的多个数据自动完成文本框

时间:2016-09-20 06:10:00

标签: jquery ajax codeigniter filter autocomplete

我想要任何人的帮助来执行此自动填充文本框。现在数据来自数据库,但我想限制显示重复数据。

以下是代码:

控制器:

<?php
class Birds extends CI_Controller
{
  function index()
  {
     $this->load->view('birds_view');
  }

  function get_birds()
  {
     $this->load->model('birds_model');
     if (isset($_GET['term'])){
     $q = strtolower($_GET['term']);
     $this->birds_model->get_bird($q);
     }
  }
}  

型号:

<?php
 class Birds_model extends CI_Model
 {
  function get_bird($q)
  {
   $this->db->select('*');
   $this->db->like('bird', $q);
   $this->db->order_by('bird');
   $query = $this->db->get('birds');
   if($query->num_rows() > 0){
      foreach ($query->result_array() as $row){
           $row_set['label']=htmlentities(stripslashes($row['bird']));
       }
   echo json_encode($row_set);
   }
 }
}  

查看:

<!DOCTYPE html>
<html>
<head>
   <title>Skills</title>
   <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
   <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
   <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
</head>
<body>
     <input type="text" id="birds"/>
<script>
     $(function() {
      function split( val ) {
       return val.split( /,\s*/ );
     }
     function extractLast( term ) {
       return split( term ).pop();
     }
    function log( message ) {
       $( "<input name='skill'>" ).text( message ).prependTo( "#log" );
       $( "#log" ).scrollTop( 0 );
     }
     $( "#birds" ).bind( "keydown", function( event ) {
        if ( event.keyCode === $.ui.keyCode.TAB &&
             $( this ).autocomplete( "instance" ).menu.active ) {
             event.preventDefault();
        }
      })
     .autocomplete({
       minLength: 1,
       source: function( request, response ) {
             $.getJSON("http://localhost:8888/auto/index.php/birds/get_birds", 
            { term : extractLast( request.term )},
            response);
    },
    focus: function() {
        return false;
    },
select: function( event, ui ) {

  var terms = split( this.value );
  if(terms.length <= 3) {

    terms.pop();
    terms.push( ui.item.label);
    log(ui.item.value);
    terms.push( "" );
    this.value = terms.join( ", " );
    return false;
  }else{
    var last = terms.pop();
    $(this).val(this.value.substr(0, this.value.length - last.length - 2));
    $(this).effect("highlight", {}, 1000);
    $(this).attr("style","border: solid 1px red;");
    return false;
   }
  },
    change: function (event, ui) {
        if (!ui.item) {
            $(this).val('');
        }
    }
 });
});
</script>
</body>
</html>  

请帮我解决这个问题。在此先感谢:)
参考:http://www.codexworld.com/autocomplete-textbox-multiple-values-jquery-php-mysql/

0 个答案:

没有答案