为什么我使用ajax和php mysql的实时搜索不会在codeigniter中显示结果？

Question

这是我的控制器代码。我测试我创建任何模型。在控制器中做所有事情。

Integer

在视图中我有以下内容..

<?php
  if (!defined('BASEPATH'))
     exit('No direct script access allowed');

 class Search extends CI_Controller
{

   function __construct() {
      parent::__construct();
      $this->load->model('Email_Model');
      $this->load->model('hash');
      $this->load->model('Crud_Model');
      $this->load->database();
      /* cache control */
      $this->output->set_header('Last-Modified: ' . gmdate("D, d M Y H:i:s") . ' GMT');
      $this->output->set_header('Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0');
      $this->output->set_header('Pragma: no-cache');
      $this->output->set_header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
      $this->session->userdata('account_id');
  }
  function searchdept()
  {
    //  $key=$_GET['key'];
      $key = 'lo';
       $array = array();
       $query=$this->db->query("select * from department where name LIKE '%{$key}%'");
      foreach($query->result_array() as $row){
        $array[] = $row['name'];
    }
    echo json_encode($array);
  }
}

和ajax代码在这里：

<div class="tab-content">


                    <div role="tabpanel" class="tab-pane fade in active" id="dept-list">

                        <div class="table-responsive table-adjusment ">
                            <table class="table table-hover">
                                <div class="table-header ">

                                    <div class="input-group dept-input">
                                        <span class="input-group-addon" id="search-dept"><i class="fa fa-search" aria-hidden="true"></i></span>
                                        <input type="text" id="typeahead" autocomplete="off" spellcheck="false" class="form-control" placeholder="Search" aria-describedby="search-dept" name="typeahead">
                                    </div>
                                </div>
                                <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>Department Name</th>
                                        <th>Description</th>
                                        <th>Options</th>

                                    </tr>
                                </thead>
                                <tbody>
                                    <?php $count = 1;
                                    foreach ($departments as $row):

                                        ?>
                                        <tr>
                                            <th scope="row"><?php echo $count++; ?></th>
                                            <td style="display: none;"><?php echo $row['department_id'] ?></td>
                                            <td ><?php echo $row['name']; ?></td>
                                            <td><?php echo $row['description']; ?></td>


                                            <td>
                                                 <!-- <button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#view-modal" type="button"><i class="fa fa-pencil-square-o" aria-hidden="true"></i></button> -->
                                                 <button class="btn btn-primary btn-sm" id="getdata1" type="button"><i class="fa fa-pencil-square-o" aria-hidden="true"></i></button>


                                                <a href="<?php echo base_url(); ?>admin/manage_department/delete/<?php echo $row['department_id']; ?>"<button class="btn  btn-danger btn-sm"><i class="fa fa-trash" aria-hidden="true"></i></button></a>
                                            </td>
                                        </tr>
                                        <?php endforeach; ?>


                                </tbody>

                            </table>
                            <div class="col-xs-12 table-footer">


                                <div class="btn-group pull-right" role="group" aria-label="">
                                    <button type="button" class="btn btn-default">Previous</button>
                                    <button type="button" class="btn btn-default">1</button>
                                    <button type="button" class="btn btn-default">Next</button>
                                </div>

                            </div>
                        </div>

                    </div>
                    <div role="tabpanel" class="tab-pane fade" id="add-dept">
                        <div class="table-adjusment">
                            <!--                                                <form class="form-horizontal">-->
                            <?php echo form_open('admin/manage_department/create', array('class' => 'form-horizontal validatable')); ?>
                            <div class="form-group">
                                <label for="dept-name" class="control-label">Department Name</label>
                                <div class=" ">
                                    <input type="text" class="form-control dept-input" id="dept-name" placeholder="Department Name" name="name">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="dept-description" class="control-label">Department Description</label>
                                <div class=" ">
                                    <input type="text" class="form-control dept-input" id="dept-description" placeholder="Department Description" name="description">
                                </div>
                            </div>

                            <div class="form-group">
                                <div class=" ">
                                    <button type="submit" class="btn btn-default">Add Department</button>
                                </div>
                            </div>
                                <?php echo form_close(); ?> 
                            <!--                                                </form>-->
                        </div>

                    </div>

                </div>

当我输入我的搜索框时，没有显示任何内容。如何在键入时在搜索框中进行实时搜索？ 在此先感谢：）