Javascript Jquery ui自动完成多个值,逗号分隔的项不起作用

Javascript Jquery ui自动完成多个值,逗号分隔的项不起作用,javascript,jquery,autocomplete,Javascript,Jquery,Autocomplete,我正在处理jquery ui自动完成,但我的要求是多个值用逗号分隔,我写的代码只对单个值有效。我尝试了这一点,但这一点对我不起作用,我几乎没有这样的要求 1) when search/autocomplate in text box it should get username and id of that user but id not show to front end just binded with user names 2)selected usernames show in tex

我正在处理jquery ui自动完成,但我的要求是多个值用逗号分隔,我写的代码只对单个值有效。我尝试了这一点,但这一点对我不起作用,我几乎没有这样的要求

1) when search/autocomplate  in text box it should get username and id of that user but id not show to front end just binded with user names
2)selected usernames show in text box with multiple values using comma separated (currently it is working for single user only comma is appending but multiple values not)
3) whenever selected any username  id associated with that user append into hidden field  " name='hidden_id[]'  "

<input type="text" name="search_val" class="form-control search_val"/>

<input type="hidden" name="hidden_id[]" class="hidden_id" value=""/>

<script>
$(function () {
    $(document).ready(function () {
        function split(val) {
            return val.split(/,\s*/);
        }
        function extractLast(term) {
            return split(term).pop();
        }
        $(".search_asset").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: "<?php echo SITE_URL . 'ajax/get_users'; ?>",
                    dataType: "json",
                    data: {
                        term: request.term, request: 1
                    },
                    success: function (data) {
                        response(data);
                    }
                });
            },

            select: function (event, ui) {
                var terms = split(this.value);
                // remove the current input
                terms.pop();
                // add the selected item
                terms.push(ui.item.value);
                // add placeholder to get the comma-and-space at the end
                terms.push("");
                this.value = terms.join(",");
                return false;
            }
        });

    });


    public function get_users() {
        $term = $_GET['term'];
        $result = $this -> db -> query("select userid,username from users WHERE username LIKE '%".$term."%' ") -> result();
        if (count($result) > 0) {
            foreach($result as $row)
            $arr_result[] = $row -> username;
            $arr_result[] = $row -> userid;
            echo json_encode($arr_result);
        }
    }
});

只需对代码进行一些小的更改,然后试试这个对我来说效果很好的方法

$function{ $.search\u val.autocomplete{ 来源:函数请求、响应{ var searchText=extractLastrequest.term; $.ajax{ 网址:, 键入:“get”, 数据类型:json, 数据:{ 搜索:搜索文本 }, 成功:函数数据{ 响应数据; } }; },焦点:函数{ 返回false; }, 选择:功能事件,用户界面{ var terms=split$'.search_val'.val; terms.pop; 如果重复$'.search_val'.val,ui.item.label{ terms.push ui.item.label; 术语.推送; $'.search_val'.valterms.join; } 返回false; } }; }; 函数分割值{ 返回val.split/,\s*/; } 上学期的函数{ 返回分割项.pop; } 函数重复{ 如果f.matchnew RegExp?:^ |,+s+?:,|${ 返回false; }否则{ 返回true; } }
我面临着这个代码的一个问题,当我们选择第一个值时,当我们键入并选择任何值时,它将第二次显示为选定值,但在选择值时,如果我们使用鼠标单击,则只会获取多个值,否则第二个值将从您的一侧删除上一个值尝试使用键盘单击而不是鼠标单击来选择两个值我已更新代码。我添加了两个1焦点:函数{return false;},2检查条件函数dublicatef,s{if f.matchnew RegExp?:^ |,+s+?:,|${return false;}否则{return true;}感谢您的出色工作,我想知道的最后一件事是如何删除重复的值,例如,一旦选定的值下次不应显示