입력하지 않고 Ajax.Autocompleter가 요청을 수행하도록하려면 어떻게해야합니까?

Question

다른 필터를 사용하는 검색을 위해 scriptaculous의 Ajax.Autocompleter를 사용하고 있습니다.

http://github.com/madrobby/scriptaculous/wikis/ajax-autocompleter

필터는 내가 성공적으로 다음 링크에서 할 배운하는 동적 Autocompleter에로 데이터를 전달하기 위해 저를 요구하고있다.

http://www.simpltry.com/2007/01/30/ajaxautocompleter-dynamic-parameters/

지금, 여러 개의 필터와 하나 개의 검색 상자가 있습니다. 입력란에 입력없이 자동 필터를 사용하여 을 입력하려면 어떻게해야합니까? 새 필터를 클릭하면 어떻게됩니까?

다음은 명확하게 설명합니다. 페이지가로드되고 여러 필터 (onclicks가있는 링크 만 있음)와 자동 완성자가 연결된 입력 필드가 하나 있습니다. 쿼리를 입력하면 자동 완성 요청이 수행됩니다. 그런 다음 다른 필터를 클릭하고 같은 쿼리로 다른 요청을 수행하지만 다른 필터를 수행하고 싶습니다.

이상 간결하게, 내가 입력 할 때마다을 원할 때 때 자동 완성 프로그램이 요청을 수행하도록하려면 어떻게해야합니까?

Answer 1

Scriptaculous 소스를보고 what happens on keypress을 확인한 결과 onObserverEvent()을 호출 해보십시오.

var autoCompleter = new Ajax.Autocompleter(/* exercise for the reader */); 
// Magic happens 
autoCompleter.onObserverEvent(); 

Answer 2

가짜 키를 누르십시오. 요청이 이루어지고 드롭 다운 상자가 표시되도록합니다. 다음은 IE와 Firefox의 차이점을 고려한 키 프레스를 위조하는 기능입니다.

function fakeKeyPress(input_id) { 
    var input = $(input_id); 
    if(input.fireEvent) { 
     // ie stuff 
     var evt = document.createEventObject(); 
     evt.keyCode = 67; 
     $(input_id).fireEvent("onKeyDown", evt); 
    } else { 
     // firefox stuff 
     var evt = document.createEvent("KeyboardEvent"); 
     evt.initKeyEvent('keydown', true, true, null, false, false, false, false, 27, 0); 
     var canceled = !$(input_id).dispatchEvent(evt); 
    } 
    } 

Answer 3

var autoCompleter = new Ajax.Autocompleter(/* exercise for the reader */); 
// Magic happens 
autoCompleter.activate(); 

Answer 4

나는 또한 활성화() 메소드는 큰 일 것을 발견했다. 여기에 내 샘플 코드가 있습니다 ....

<script type="text/javascript"> 
    /*<![CDATA[*/ 

    var autocomp1 = new Ajax.Autocompleter("search", "AjaxResultsListPlaceholder", "ajaxServerSideSearchHandler.php", { 
      frequency: 1, 
      minChars: 10, 
      indicator: "AjaxWorkingPleaseWaitPlaceholder", 
      }); 


    /*]]>*/ 
</script> 

<form id="theform"> 
    <input type="text" id="search" name="search" value="" /> 
    <input type="button" id="btn_search" name="btn_search" value="Search" onclick="autocomp1.activate();" /> 
    <div id="AjaxWorkingPleaseWaitPlaceholder" style="display: none; border: 1px solid #ffaaaa;"> 
    </div> 
    <div id="AjaxResultsListPlaceholder" style="display: none;; border: 1px solid #aaffaa;"> 
    </div> 

</form>