4

jquery ui autocomplete를 (를) 사용하여 검색 한 결과 훌륭한 결과를 얻었습니다. 현재 도시와 국가의 json 목록을 사전로드하여 서버가 빠르게로드되고 서버를 폴링 할 필요가 없습니다. 그러나 지금, 나는 호텔, 레스토랑, 등등 내 장소의 즉 내 구체적인 이름을 검색 내 자동 완성에 추가하고 싶습니다.jquery ui 사전 및 사후 결과로 복잡한 검색 자동 완성

내 질문에 그냥 미리로드 된 도시와 국가 목록을 도랑해야 일반 바닐라 아약스 데이터베이스 쿼리? q = 그들이 입력하거나 가능하고 두 가지 사이에 일종의 하이브리드를 갖는 것이 유용 할 것입니다. 그들이 특정 수의 문자에 도달하거나 5 개 미만의 결과가 나올 때까지 IE는 미리로드 된 목록입니까?

로딩 시간이 절약 되나요? 아니면 두통이됩니까? 그렇다면 어떻게해야합니까?

원래 아약스 쿼리로 사용했지만 사전로드 된 json으로 전환하여 속도를 향상 시켰습니다. 도시와 국가의 전체 목록은 작지만 장소 목록이 큽니다. 사람들이 특정 장소가 아닌 위치를 검색하는 시간의 99.9 %.

답변

4

당신이 이것을 달성 할 방법 :

당신은 자동 완성의 source 옵션에 함수를 전달하여 이런 일을 수행 할 수 있습니다. 이 소스를 사용하여 "하이브리드"자동 완성을위한 아이디어의

$("#tags").autocomplete({ 
    source: function(request, response) { 
     // This is how autocomplete finds matching results by default: 
     var results = $.ui.autocomplete.filter(common, request.term); 

     if (results.length < 5) { 
      // Perform an ajax call. 
      // In the success method, call response(results) 
     } else { 
      response(results); 
     } 
    } 
}); 

둘 : 당신이 AJAX 호출을 사용하거나 클라이언트 측에 데이터를 필터링하기 위해 필요한 경우 그 함수 내에서 결정하기 위해 몇 가지 논리를 수행 할 것 흥미로웠다. 그러나 솔루션을 테스트하는 동안 잠재적 인 유용성 문제가 발생했습니다. 일반적으로이 유형의 컨트롤을 사용하면 입력 할 때 보다 작은 결과를 얻을 수 있습니다.

예를 들어

는 : 해당 지역의 소스 배열은 다음과 같습니다 말할 수 :

['jquery', 'jquery-ui', 'jquery-ajax', 'jquery-plugins'] 

그리고 당신은 후, 말, 5 개 문자를 입력하는 더 많은 결과를 보여주는 전략을 사용합니다. 사용자가 j-q-u-e-r-y을 입력 한 후 y을 입력하면 AJAX 호출이 트리거되어 목록에 더 많은 결과가 표시되며 사용 사례에 따라 사용자가 이해하기 쉽지 않을 수 있습니다.

예 :http://jsfiddle.net/andrewwhitaker/wSBa3/

난 당신이 다시 서버에서 올 수있는 결과의 수에 일부 제한을 설정할 때이 좋아진다 생각합니다. AJAX 호출이 발생하기 전에이 값을 최소 결과 수와 동기화하면 상호 작용이 펑키하지 않게 보입니다. 사실,이 예는 나에게 더 그럴듯한 개념을 만들어 :

예 :http://jsfiddle.net/andrewwhitaker/NxELC/


그것은 가치가?

로드 시간이 절약되거나 두통이 발생합니까?

아마도 둘 다!

저는 이것이 리소스 집약적 인 쿼리, 얼마나 많은 데이터에 대해 이야기하는지, 그리고 이와 같은 솔루션이 어떻게 유지 될 수 있는지에 달려 있다고 생각합니다. 처음 두 가지 옵션에 대해서는 정말로 추측 할 수 없지만 두 가지 목록을 유지 관리하는 데 유지 관리 문제가 발생할 수 있다고합니다. 그 문제는 당신이 사용하고있는 서버 측 기술에 달려 있습니다. 나는 당신이 그것을 정확하게하면, 당신은 아무런 문제가 없을 것이라고 생각합니다.

오랫동안 답변 해 주셔서 미리 사과하지만 도움이되기를 바랍니다.