在jQuery的自動完成，如何disply標籤並提交相應的標籤

我有一個使用jquery自動完成的搜索字段。在此文本框下拉列表提供自動完成的員工名稱。但當我的表單提交我不希望人員姓名與表格一起發送，我希望將表格與員工ID一起發送。我該怎麼做？在jQuery的自動完成，如何disply標籤並提交相應的標籤

<input id="employee"> 
<input type="hidden" id="employee_id">

上面給出的是我用

$(function() { 
    $.ajax({ 
     url: '/accounts/allEmp', 
     type: "get", 
     cache: false, 
     success: function (data) { 
      var arr = []; 
      arr = data.employee; 
      $("#employee").autocomplete({ 
       minLength: 0, 
       source: arr, 
       focus: function (event, ui) { 
        $("#employee").val(ui.item.name); 
        return false; 
       }, 
       select: function (event, ui) { 
        $("#employee").val(ui.item.name); 
        $("#employee_id").val(ui.item.id); 
        return false; 
       } 
      }) 
       .data("ui-autocomplete")._renderItem = function (ul, item) { 
        return $("<li>") 
         .append("<a>" + item.name) 
         .appendTo(ul); 
      }; 
     } 
    }); 
});

這是劇本我used.While我在文本框輸入字符它不顯示任何結果，但在文本框時，刪除文本字段這些字符它將顯示所有實體（排序不工作）。而陣列看起來像

array="employee": 
[ { "name": "a", "id": 1 }, 
{ "name": "b", "id": 2 }, 
{ "name": "c", "id": 3 } ]

請幫助me.Thanks提前。

來源

2014-04-28 Anna

你是否控制源url的服務器端？如果是這樣，我建議您使用"value"屬性名稱而不是"name"，如autocomplete api中所述。否則，您可以修改該陣列並隨時添加"value"屬性。

這裏是fiddle我剛剛從您的代碼段創建。隨着點擊「發送」它崩潰，我不知道爲什麼，但如果你在你的開發人員的面板網絡請求看起來是使用參數打通：

employee[name]:Fred 
employee[id]:first

來源

2014-04-28 14:20:48 lompy

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代碼：

<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()">

來源

2014-07-14 08:23:24

在jQuery的自動完成，如何disply標籤並提交相應的標籤

回答

相關問題