Question

我有一个使用jquery autocomplete的搜索字段。在这个文本框中下拉了autocomplete建议的员工姓名列表。但是当我提交表单时，我不希望这些人名与表单一起发送，我想要与表单一起发送的员工ID。我能做到这一点吗？

$( "#tags" ).autocomplete({
source: array
});

这是我使用的脚本。数组看起来像

  array= [{"a",1},{"b",2},{"c",3}.........]

请帮帮我。谢谢。

Answer 1

尝试使用像这样的JSON对象

array = [
     {label: "a", value: 1},
     {label: "b", value: 2}
]

字段标记用户将看到的文本和值 - id。您还可以使用其他文件，例如category，desc，icon

Answer 2

如果您在自动填充文本框中有多个值，则需要将其存储在数组中并通过服务器端传递

var ids = [];
$('#id').autocomplete({

select: function( event, ui ) {
 ids.push( ui.item.value );
});

});

ids数组将包含所有选定的员工ID，类似地，如果用户从自动填充文本框中取消选择员工，您还必须从该数组中删除此ID

Answer 3

<强> DEMO

JS代码：

var data = {
    json: "{\"employee\":[{\"value\":\"A\",\"id\":\"1\"},{\"value\":\"B\",\"id\":\"2\"},{\"value\":\"C\",\"id\":\"3\"}]}"
}


$(function () { 

$('#submit').click(function(){
    alert('Employee name = '+$('#employee_name').val()+' Employee id = '+$('#employee_id').val());    
});   

    $.ajax({
        url:"/echo/json/",
        data: data,
        type: "POST",
        success:function(data) {
            console.log(data);
            var arr = data.employee;
            $("#employee_name").autocomplete({
                minLength: 0,
                source: arr,
                select: function (event, ui) {
                    $("#employee_name").val(ui.item.value);
                    $("#employee_id").val(ui.item.id);
                    return false;
                }
            });
        }
    });
});

HTML code：

<form>
    Employee name (Type like "A" or "B" or "C")<br>
    <input id="employee_name" name="employee_name">
    <br>
    Selected Employee id (hidden field):        
    <input type="text" id="employee_id" name="employee_id" readonly>
    <br>    
    <input type="button" value="Submit" name="submit" id="submit" onclick="check_fields()">

如何在jquery自动完成中查看标签并提交id

3 个答案: