自动填充功能不起作用

时间:2014-10-07 02:02:04

标签: javascript jquery autocomplete

我的自动填充功能有问题。当我使用第一个输入文本将用于自动完成但是当我使用我创建的添加函数来附加相同的元素时,它不起作用。

这是我的代码:

<script>
                $(document).ready(function(){
            $("#addCF").click(function(){
$("#customFields").append('<tr valign="top"><th scope="row"><label for="customFieldName">Custom Field</label></th><td><input type="text" class="med"  name="customFieldName[]" value="" placeholder="รายชื่อยา" />&nbsp; <input type="text" class="code" name="customFieldValue[]" value="" placeholder="Input Value" /> &nbsp; <a href="javascript:void(0);" id="remCF">Remove</a></td></tr>');
                });

$("#customFields").on('click', '#remCF', function(){
$(this).parent().parent().remove();
                    }       );

                    });

                    </script>

                    <script>//auto complete Code
 $(function() {
$('.med').autocomplete({
source: "show.php",minLength: 2,
select:function( event, ui ) {
 $('#name').val(ui.item.name);
}
});

});
</script>


<table class="form-table" id="customFields">
            <div id="name" ></div>
    <tr valign="top">
        <th scope="row"><label for="customFieldName">Custom Field</label></th>
        <td>
            <input type="text" class="med"  name="customFieldName[]" value="" placeholder="รายชื่อยา" /> &nbsp;
            <input type="text" class="code" name="customFieldValue[]" value="" placeholder="จำนวน" /> &nbsp;

            <a href="javascript:void(0);" id="addCF">ADD</a>
        </td>
    </tr>
</table>

http://jsfiddle.net/earc4436/3/

1 个答案:

答案 0 :(得分:0)

这种情况正在发生,因为您在Javascript中使用了ID,当您添加第二个字段时,它们是重复的。您需要使用类或更改表单中每个字段的ID。

<input type="text" class="code" id="customFieldValue" name="customFieldValue[]" 
value="" placeholder="จำนวน" />