자동 완성 선택 상자가있는 Jquery UI 대화 상자

Question

jqueryUI 대화 상자에서 자동 완성 선택 상자를 구현해야합니다.

는 여기를 참조하십시오 http://jsfiddle.net/zcgWa/

현재 대화 상자가 선택 상자를 넘쳐있다. (선택 상자 클릭) jqueryUI 스타일 오버 플로우를 제거하여 해결책을 찾았습니다 : 숨김.

.ui-dialog { 
overflow: hidden; 
position: absolute; 
top: 0; 
left: 0; 
padding: .2em; 
outline: 0; 
} 

그러나 오버플로는 기본적으로 제공되는 네이티브 대화 상자 스타일이므로 완벽한 해결책이 아닌 것 같습니다. 또한 프로젝트 전반에 걸쳐 많은 대화 상자 팝업이 표시되어 오버플로를 제거하면 일부가 제대로 작동하지 않을 수 있습니다.

더 좋은 해결책이 있습니까?

감사합니다.

Answer 1

필자는 자동 완성 및 툴팁을 만든 후 래퍼에 드롭 다운을 나타내는 <input>을 추가하여이 문제를 해결할 수있었습니다. 당신의 JS 바이올린의 즉 이동 라인 (18)

.appendTo(this.wrapper) 

(이 후) 30 라인 수 :

.tooltip({ 
    tooltipClass: "ui-state-highlight" 
}) 
.appendTo(this.wrapper); 

는 참조 http://jsfiddle.net/nA5L2/1/