자동 완성 기능이 작동하지 않습니다.

Question

자동 완성 기능에 문제가 있습니다. 첫 번째 입력 텍스트를 사용할 때 자동 완성을 위해 입력 텍스트가 사용되지만 첫 번째 텍스트와 같은 요소를 추가하기 위해 내가 만든 추가 기능을 사용할 때 작동하지 않습니다.

여기 내 코드입니다 :

<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/

Answer 1

당신이 그들이 중복되어 두 번째 필드를 추가 할 때, 당신의 자바 스크립트에서 ID를 사용하고 있기 때문에이 일어나고있다. 양식을 사용하여 클래스를 사용하거나 각 필드의 ID를 변경해야합니다.

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