CodeIgniter中的jQuery UI自动完成显示值而不是标签

时间:2015-09-29 04:25:28

标签: jquery codeigniter jquery-ui autocomplete jquery-ui-autocomplete

我一直在关注this教程,在我的表单中创建自动完成功能。我对codeigniter和jquery很新。 我的表名是'user_profile' 我想自动完成'comp_person_name',值应为'p_u_id'。

这是我的模特

public function get_user($q){
    $this->db->select('comp_person_name,p_u_id');
    $this->db->like('comp_person_name', $q);
    $query = $this->db->get('user_profile');
    if($query->num_rows > 0){
      foreach ($query->result_array() as $row){
        // $row_set[]=htmlentities(stripslashes($row['comp_person_name']));
         $new_row['label']=htmlentities(stripslashes($row['comp_person_name']));
         $new_row['value']=htmlentities(stripslashes($row['p_u_id']));
        $row_set[] = $new_row; //build an array

      }
      echo json_encode($row_set); //format the array into json data
      }
    }

这是我的控制器

 public function get_users(){
        $this->load->model('user_model');
        if (isset($_GET['term'])){
        $q = strtolower($_GET['term']);
        $this->user_model->get_user($q);


            }
        }

这是函数调用

$("#partners").autocomplete({
    source: "get_users" ,
     minLength: 0
        }).focus(function(){            
            $(this).trigger('keydown.autocomplete');
        });

&安培; Html代码

 <div class="form-group">
     <label class="col-sm-2  control-label">Referral partner </label>
      <div class="col-sm-10">                                   
       <input type="text" id="partners"  name="assign_to" placeholder="Search    partner"  class="form-control"  />
      </div>
   </div>

问题是,当我按下按键时,它会显示下拉列表中的人员姓名和输入表格上的值。如何在输入框中输入名称。参见下面的图片

enter image description here

1 个答案:

答案 0 :(得分:0)

我在this stackoverflow thread

的帮助下解决了自己

编辑Javascript到

$("#partners").autocomplete({
             source: "get_users",
             minLength: 2,
        select: function(event, ui) {
            event.preventDefault();
            $("#partners").val(ui.item.label);
            $("#partners-hidden").val(ui.item.value);
            },
        focus: function(event, ui) {
            event.preventDefault();
            $("#partners").val(ui.item.label);
            $("#partners-hidden").val(ui.item.value);
        }
    });

并在html中添加了一个隐藏的输入字段,其中id为#partners-hidden,用于存储和提交值