jquery - Jquery自动完成仅在一个输入中工作

Question

我创建了三个输入用于 jquery 自动完成，但只有第一个有效。其他的不显示值！你如何在这里看到：

我的输入：

<input type="text" name="FirstName" class="typef">
<input type="text" name="FirstName" class="typef">
<input type="text" name="FirstName" class="typef">

我的代码：

$(function(){
$('.typef').autocomplete({
source: "/patients/list",
focus: function( event, ui ) {
    $( ".typef" ).val( ui.item.nachnahme + " " + ui.item.geburtsdatum ),
    $( ".typef2" ).val(ui.item.id );
    return false;
},
select: function( event, ui ) {
    return false;
  }

 })
.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
  return $( "<li>" )
    .append( "<a>" + item.vorname + " " + item.nachnahme + " " + item.geburtsdatum + " " + "</a>" )
    .appendTo( ul );
};
});

Answer 1

尝试为这些字段分配不同的 ID

并更改$('.typef').autocomplete({为 $('#id1, #id2, #id3').autocomplete({

我更新了小提琴供您参考http://jsfiddle.net/t8CnW/6/

Answer 2

尝试

$(function(){
    $('.typef').autocomplete({
        source: "/patients/list",
        focus: function( event, ui ) {
            $( this ).val( ui.item.nachnahme + " " + ui.item.geburtsdatum ),
                $( this ).val(ui.item.id );
            return false;
        },
        select: function( event, ui ) {
            return false;
        }

    }).each(function(){
        $(this).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
            return $( "<li>" )
            .append( "<a>" + item.vorname + " " + item.nachnahme + " " + item.geburtsdatum + " " + "</a>" )
            .appendTo( ul );
        };
    })
});

演示：小提琴

Answer 3

改变

$('.typef').val( ui.item.nachnahme + " " + ui.item.geburtsdatum)

至

$(ui).val( ui.item.nachnahme + " " + ui.item.geburtsdatum)

解决重复问题。

这是你的小提琴