2011-08-24 6 views
0

동적으로 생성 된 입력란에 자동 완성을 첨부하고 싶습니다. 외부 이벤트 (예 : 버튼 클릭)에서 생성 된 사람들과이 작업을 수행 할 수 있습니다. BUT 필요한 경우 입력 상자는 자동 완성이 첨부 된 이전 입력 상자의 ONSELECT 이벤트에서 생성됩니다.Jquery 자동 완성 반복

즉, 처음에는 내 페이지에 입력란 (자동 완성 포함)이 있습니다. 옵션이 ONSELECT로 선택되면 다른 입력 상자가 생성됩니다. 문제 - 생성 된 입력 상자에도 자동 완성 기능이 연결되어 있어야합니다.이 입력란의 ONSELECT 이벤트는 다른 입력 상자를 생성해야하며, 이는 영원히 계속되어야합니다.

저는 주로이 논리를 필요로합니다. 나는 문법이 좋다. 루핑 문제에 접근하는 방법을 모른다.

나는 여기에서 다른 문제를 읽었지만 동일한 경우가 필요하다. 그러나이 경우 요소들은 외부 적으로 생성된다. 어떤 도움을 주셔서 감사합니다. 미리 감사드립니다. 내가 여기에 새로운 오전


편집 -이 --- 감사의 코드 롭 @ formatted- 을 게시하는 방법을 모르겠어요. 나는 너의 생각이 마음에 들었다. 그러나 저는 왜 당신이 결국 .val ('')을 사용했는지 알지 못했습니다. 아직 작동하지 않습니다. 다른 비슷한 방법을 시도해 보았습니다 (부모 요소 (div # in)에 복제본을 추가하는 것과 같습니다). 선택시 알림이 표시됩니다. 즉, onselect 이벤트가 실행 중임을 의미합니다. 여기 코드는 -

$.post("returncategory.php", 
     {}, 
      function(data) 
      { 
       $('.cat').autocomplete({ 
        source: data, 
        type:'json', 
        minchar: 1, 
        fillin: false, 
        onSelect: function() { 
         //alert($(this).parent().get()); 
         //$(this).clone(true, true).appendTo($(this).parent()); 
         //$(this).clone(true, true).appendTo('#in'); 
         $(this).clone(true, true).insertAfter($(this)).val(); 
        } 
       }); 


      }, 
      "JSON"); 

편집 :

편집 포맷 수정 코드 : 나는 해결책 : 감사합니다 귀하의 입력 롭에 대한 많은 발견! 여기에 내가 무슨 짓을했는지 -

$('.cat').live('click', function() { 

       $(this).autocomplete({ 
       url: "returncategory.php", 
       type: "json", 
       minchar: 1, 
       onSuggest: function() { 

       }, 
       onSelect: function() { 
        $('#clicker').click(); 
       } 
      }); 
      $(this).focus(); 
    }); 

$('#clicker').bind('click', function() { 
    var newItem = $("<br><br><input class='cat' type='text'name='td_products["+1+"]'/>"); 
    $('#in').append(newItem); 
    newItem.find('input').autocomplete({ 
       url: "returncategory.php", 
       type: "json", 
       minchar: 1, 
       onSuggest: function() { 

       }, 
       onSelect: function() { 
        $('#clicker').click(); 
       } 
      }); 

});

P. 나는 아주 행복하다. 이제 형식화 된 코드를 게시하는 방법도 알았습니다. 감사! 내가 선택에 말을

답변

0

, 당신은 다음 $this.clone(true, true).insertAfter($this).val('')

http://api.jquery.com/clone/

+0

이 편집에 내 대답을 참조하십시오 할, 현재 입력으로 jQuery를 참조를 잡아해야합니다. 감사. – MindHacker

+0

$ (this) 디버깅을 시도하십시오. #cat 입력을 참조하고 다른 내용이 아닌지 확인하십시오. 'onSelect : function() {$ (this) .remove()}'를 시도하고 입력이 사라 졌는지 확인하십시오. 정확히 어떤 자동 완성 플러그인을 사용하고 있는지 확실하지 않지만 jQuery UI를 사용하는 것이 좋습니다. – Rob

+0

좋아요, 자동 완성 기능은 "this.ac"를 참조로 사용하므로 다음 코드가 작동하기 시작했습니다. 생성 된 상자는 자동 완성을 수행 중입니다. 그러나 두 번째 상자에서 선택을하면 세 번째 상자가 생성되었지만 자동 완성을 지원하지 않았습니다. 여기 코드는 ----- $ ('. cat')입니다. 자동 완성 ({ url : "returncategory.php", 유형 : "json", minchar : 1, onSelect : function() { $ this.ac) .clone (true, true) .insertAfter (this.ac); } }); – MindHacker