2013-04-22 1 views
0

페이지에 여러 개의 입력란이 있습니다. 모두 자동 완성 클래스가 있으며, 그 아래에 자동 완성 결과를 추가 할 div가 있습니다. 그러나 클래스의 div에 추가한다고 말하면 가장 가까운 div가 아닌 div가됩니다. 이 문제를 해결하기 위해 몇 가지 자바 스크립트를 조합하려고 시도했지만 벽돌 벽을 실행하고 동일한 오류가 계속 발생합니다. 제공 할 수있는 도움을 주시면 감사하겠습니다.jQuery 자동 완성을 사용하여 클래스의 가장 가까운 div에 추가

다음
<script type="text/javascript"> 
$(document).ready(function() { 
    var div_id; 
    $("input.autocomplete").autocomplete({ 
     set: div_id = $(".autocomplete").keyup(function() { 
      $('.autocomplete').closest('div').find('.container').attr('id'); 
     }), 
     appendTo: div_id, 
     source: function (request, response) { 
      $.ajax({ 
       url: '/Home/GetUsers', 
       type: "POST", 
       dataType: "json", 
       data: { query: request.term }, 
       success: function (data) { 
        response($.map(data, function (item) { 
         return { label: item, value: item }; 
        })); 
       } 
      }); 
     } 
    }); 
})  
</script> 

뷰의 모습입니다 : 여기

내 자바 스크립트입니다

Employee Name (Team Leader): <input type ="text" name="empName1" class="autocomplete"/> 
    <div class ="container" id = "container0"></div> 
    <br/> 
    <br/> 
    Employee Name (Event Process Owner): <input type ="text" name="empName2" class="autocomplete"/> 
    <div class ="container" id = "container1"></div> 
    <br/> 
    <br/> 
    Employee Name (Sponsor): <input type ="text" name="sponsor" class="autocomplete"/> 
    <div class ="container" id = "container2"></div> 
    <br/> 
    <br/> 
    Employee Name: <input type ="text" name="empName3" class="autocomplete"/> 
    <div class ="container" id = "container3"></div> 
    <br/> 
    Employee Name: <input type ="text" name="empName4" class="autocomplete"/> 
    <div class ="container" id = "container4"></div> 
    <br/> 

그리고이 프로젝트를 시작할 때 내가 오류는 "마이크로 소프트의 JScript 런타임 오류입니다 : 메서드 또는 속성 액세스에 예기치 않은 호출이 발생했습니다. " 잘해야

$('.autocomplete').next("div").attr("id")); 

this.appendChild(e) 

답변

0

변경이 줄을

$('.autocomplete').closest('div').find('.container').attr('id'); 

:이 오류를 얻을 때 내 jquery.min.js (1.8.3)이 강조 표시됩니다.

+0

스크립트input box에서 지금

Employee Name (Sponsor): <input type ="text" name="sponsor" data-container_id="container2" class="autocomplete" /> <div class ="container" id = "container2"></div> 

추가 "Microsoft JScript 런타임 오류 : 'element'속성 값을 가져올 수 없습니다. 개체가 null이거나 정의되지 않았습니다."if (this.menu.element.is ("visible :))"in jquery-ui-1.8 .20.js –

0

이 시도 :

HTML

를 내가 얻을 때 data container id

$("input.autocomplete").autocomplete({ 
    appendTo: $('#'+$(this).data('container_id')),//it will give you container-id 
    .... 
    .... 
+0

응답 해 주셔서 감사합니다. 시도 할 때 "Microsoft JScript 런타임 오류 : 메서드 또는 속성 액세스에 예기치 않은 호출이 발생했습니다."라는 오류 메시지가 나타납니다. jquery.min.js의 동일한 위치에서 –

+0

방금 ​​세 번째 제안을 시도하고 "Microsoft JScript 런타임 오류 : '요소'속성 값을 가져올 수 없습니다. 개체가 null이거나 정의되지 않았습니다."에서 "var ul = \t \t \t .empty() \t \t \t .zIndex (this.element.zIndex() + 1) this.menu.element; " in jquery-ui-1.8.20.js –

+0

@Danger_Fox 위의 코드를 사용해보십시오. 사용 방법이 변경되었습니다. –

관련 문제