텍스트 상자 자동 완성 DOJO

텍스트 상자 자동 제안에 DOJO를 사용하는 간단한 방법을 찾고 있습니다. PHP 스크립트를 사용하여 PHP 스크립트를 사용하여 쿼리하는 db 테이블에는 100,000 개가 넘는 레코드가 있으므로 FilteringSelect 또는 ComboBox 형식이 아니어야합니다. 분명히 사용자를 원하지 않습니다. 아래쪽 화살표를 클릭하여 전체 데이터 세트를 반환합니다.텍스트 상자 자동 완성 DOJO

JQuery와 YUI와 같은 다른 라이브러리는 간단하지만이 프로젝트는 DOJO 기반이며 다른 JS 클래스를 소개하기는 어렵습니다.

출처

2011-10-24 Mark Hall

어떻게할지는 모르지만 Firebug를 사용하여 jQuery 또는 YUI 함수 호출에서 항상 함수 호출을 추적하고 어떻게 수행하는지 확인할 수 있습니다. – Nightfirecat

작동 중!

내가 쿼리하는 100,000 개의 레코드가 있더라도. 리턴 속도는 30ms 미만입니다. 나는 심지어 데이터베이스 크기를 50 만 건으로 늘렸고 자동 제안 속도는 매우 만족 스럽습니다 (여전히 120 밀리 초 미만). PHP 쪽에서 캐싱을 조금이라도 더 잘 수행 할 수 있다고 확신합니다.

QueryReadStore 및 FilteringSelect으로 끝났습니다. JsonRestStore은 아마도 효과가 있었지만 dojo 사이트에서 간단한 예제를 발견하고이를 기반으로 작성했습니다.

물론

  var vendorStore = new dojox.data.QueryReadStore({ 
       url: "../vms/htdocs/ajax/search.php" 
      }); 

      var vendorSelect = new dijit.form.FilteringSelect({ 
       name: "vendorSelection", 
       store: vendorStore, 
       autoComplete: false, 
       required: true, 
       labelType: "text", 
       placeHolder: "Search vendors", 
       pageSize: 20, 
       hasDownArrow: false, 
       style: "width: 175px;", 
       searchAttr: "company_name", 
       id: "vendorSelect" 
      }, 
      "vendorSelection"); 

      vendorSelect.startup();

페이지의 본문에 somwhere <select id="vendorSelection"></select> 스틱 : 짧은 을 달콤한 -

여기에 매우 큰 데이터 세트를 치는 자동 제안 텍스트 상자에 대한 도장 작업 코드입니다. 훌륭하게 작동합니다.

다시 한번 감사드립니다!

출처

2011-10-25 02:59:24

궁금합니다. ie7 또는 ie8의 성능은 어떻습니까? 나는 약 1400 개의 레코드로 끔찍한 퍼포먼스 문제를 겪고있다.하지만 FF와 크롬에서는 잘 돌아 간다. –

Ryan, ie7을 사용한 테스트를 수행하지는 않았지만 내 자동 완성은 FF 및 크롬과 마찬가지로 ie8과 거의 동일합니다. 나는 벤치마킹을하지 않았으므로 계산 가능한 차이가있을 수 있습니다. 사용자 경험 관점에서 보면 ie8과의 차이는 없습니다. 불행히도 ie7 설치를 테스트 할 수있는 권한이 없습니다. –

아마도 첫 번째 X 행을 쿼리로 반환 할 수 있습니다. 각각의 새 클릭은 X를 건너 뛰고 X 개의 새 행을 반환합니다.

출처

2011-10-24 04:11:57 JRL

jQuery 또는 YUI는 잘 모르지만 Dojo의 ComboBox 및 FilteringSelect에는 pageSize 속성이있어 얼마나 많은 항목이 있는지 제한 할 수 있습니다 상점에서 즉시 요청했습니다. 적용 가능한 경우 추가 옵션을 통해 페이지를 표시하기 위해 "more choices"및 "previous choices"옵션과 함께 드롭 다운에 해당 개수의 항목 만 표시됩니다.

모든 것을 가져 오는 저장소 대신 각 페치 (예 : dojox.data.QueryReadStore 또는 dojox.data.JsonRestStore)에서 서버를 쿼리하는 데이터 저장소와 함께 저장하십시오 (예 : dojo.data.ItemFileReadStore), 그리고 당신은 당신이 원하는 것을 할 수 있어야합니다.

출처

2011-10-24 15:49:23

텍스트 상자 자동 완성 DOJO

답변

관련 문제