2012-04-27 4 views
1

jQuery에서 자동 완성 플러그인을 사용하고 있으며 숨겨진 입력 및 텍스트 입력과 같은 추가 요소가있는 div 요소에 내 결과 선택을 추가하고 싶습니다.jQuery 자동 완성 추가 선택 div

이것은 jQuery를 내 기능입니다 :

이 내 html 코드 지금 내 코드가 잘 작동함으로써

$("#buscar").autocomplete({ 
    source: "procesos/buscarPersona.php", 
    minLength: 2, 
    select: function(event, ui) { 
     $("#acreditados") 
      .append('<div class="col50"><p>' 
      + '<input type="hidden" name="id" value="' + ui.item.id_persona + '"/>' 
      + ui.item.value 
      + '</p></div>' 
      + '<div class="col50 f-right"><p>Monto:' 
      + '<input type="text" /></p></div>'); 
     } 
}); 

그러나 나는 표시의 append 기능을 유지하기 어려운 발견 선택 결과 및 추가 입력. 이게 더 간단하게 load() 함수를 사용할 수있는 방법이 있습니까? 최종 출력은 마지막 선택이 아닌 다중 선택을 추가해야합니다.

답변

1

로드를 사용하지 마십시오.로드는 사용하지 마십시오. 서버와의 통신을 의미합니다. 유효성 검사 나 더 복잡한 로직이 필요하지 않은 한 모든 선택에 대해 네트워크 액세스를 피해야합니다. .

로드를 사용하면 각 선택에 대해 서버와 통신 한 다음 html이 전달됩니다.

이 솔루션은 못 생겼지 만 더 효율적입니다.

편집 :

선택에
<div class="dynamiccontentcont"> 
     <div class="col50"> 
      <p><input type="hidden" name="id" value=""/></p> 
     </div> 
     <div class="col50 f-right"> 
     <p>Monto:<input type="text" /></p> 
    </div> 
    </div> 

  1. 클론이 사업부를 현재에하고있는 바와 같이 (선택된 값 jQuery('.dynamiccontentcont').clone()
  2. 장소를 호출하여 :

    이 별도로 div에 보관 귀하의 코드)

  3. div에 요를 추가하십시오. ur 코드
+0

이 방법을 좀 더 우아하게 만들 수 있습니까? 난 그냥 모든 선택에 삭제 버튼을 추가하고 더 추한 내 코드를 만들 필요가 실현 –

+0

두 번째 div adittional 클래스 "f- 오른쪽"그래서 복제가 예상대로 작동하지 않습니다. –

+0

편집 내 대답, 부모 및 복제 부모 내의 모든 내용을 랩 – mprabhat