jquery - 如何使用自动完成设置 ID 和名称

Question

在行动课

public class Supplier extends ActionSupport{

        private ArrayList supplierList;
       //contains list of supplisers with attribute(id,name,address,mailid)
      //getter and setter of supplierList
    }

这是我的表单（在 Jsp 中）

<form action="test" method="post">
   <input type="text" name="supplierName" id="supplierName">
    <input type="hidden" name="supplierId" id="supplierId">
</form>

我想显示供应商列表名称的自动完成功能，并根据选定的名称，我想在文本和隐藏框中设置其 ID 和名称，在提交表单时，我想发送元素的 ID

Answer 1

也许对您有帮助：1）将属性类设置为您的自动完成功能，2）使用类名查找自动完成功能

 $( elem ).autocomplete({
source: ...}).autocomplete( "widget" ).addClass( "whatever" );

它来自http://bugs.jqueryui.com/ticket/8928

Answer 2

您必须在自动完成的“选择”事件中设置隐藏字段的值，以便当用户从自动完成建议列表中选择一个名称时，隐藏字段设置为该名称的 ID：

$('#textbox-id').autocomplete({
source: // Your ajax call here.

select: function(event, ui){
$('#supplierId').val(ui.item.id);
}
});

http://jqueryui.com/autocomplete/#remote

Answer 3

您应该使用 jquery 定义一个 live 方法，以便任何时候单击自动完成元素之一来设置输入

<script type="text/javascript">
$('div.supplierItem').live('click', function(){
   $('#supplierId').val($(this).attr('id'));
   $('#supplierName').val($(this).val());
});
</script>

<div class="autoComplete">
   <div class="supplierItem" name="aaa" id="1">
      value1
   </div>
   <div class="supplierItem" name="bbb" id="2">
     value2
   </div>
</div>