2015-01-08 2 views
-1

내가 잘못하면 나를 바로 잡아주세요 ... 나는이 게시물을 편집하기 전에 오류없이 코드를 작성합니다. 하지만 Minimal, Complete 및 Verifiable 예제를 만드는 방법에 대한 의견을 읽은 후. 이전에 작성한 최소한의 스크립트가 작동하지 않았기 때문에 나는 매우 혼란 스럽습니다. 복잡한 코드가 있기 때문에 전체 코드를 포함 할 수 없었고, 검증 가능한 예제가 없었습니다.ExtJS에서 google.maps.places.autocomplete에서 자동 완성을 만드는 방법

EXTJS에서 내 텍스트 필드를 자동 완성하기 위해 google.maps.places에서 자동 완성을 만드는 방법을 알아두면됩니다.

전에 감사드립니다.

+0

질문 코드 작동? ")에는 원하는 동작, 특정 문제 또는 오류 및 질문 자체에서이를 재현하는 데 필요한 가장 짧은 코드가 포함되어야합니다. 분명한 문제 성명이없는 질문은 다른 독자에게 유용하지 않습니다. 참조 : [최소한의 완전하고 검증 가능한 예제를 만드는 방법] (http://stackoverflow.com/help/mcve). – geocodezip

+0

죄송합니다. 잘못 넣었습니다. 제발 투표하지 마십시오, 코드를 편집했습니다 ... –

+0

MCVE! 위의 코멘트를 읽으십시오! – MrUpsidown

답변

1

나는이 질문을 @Rob Schmuecker 답변에서 해결했습니다. 따라서, 사용하는 것과 같이 구글에서 JSON을 호출 할 적절한 프록시를 사용하는 방법에 대한이 질문의 초점이 데이터 모델에서,

addressModel.getProxy().setExtraParam('url', 'http://maps.google.com/maps/api/geocode/json?address=' + queryString + '&sensor=false'); 

동적으로 PARAMS을 설정 : 그 후

addressModel = Ext.define("Addresses", { 
    extend: 'Ext.data.Model', 
    proxy: { 
     type: 'jsonp', 
     url: 'https://jsonp.nodejitsu.com', 
     reader: { 
      type: 'json', 
      root: 'results', 
      totalProperty: 'totalCount' 
     } 
    }, 

    fields: ['formatted_address'] 
}); 

당신 콤보 박스를 만들고 콤보 상자에 각 키 업에 리스너를 추가하여 프록시에서 extraparam을 호출 할 수 있습니다.

는 @ 롭 Schmuecker에서 데모입니다 : https://fiddle.sencha.com/#fiddle/g70

이 내 문제 해결 롭로부터 완전한 답변입니다 : 왜이 ​​아닌 디버깅 도움을 ("추구 Check This...

0

Google Places-Library를 사용하여 문제를 해결할 방법을 찾아 냈습니다.

Google 지역 API
2) 사용자 정의 프록시 만들기 (필자는 Ext.data.DataProxy을 확장 한 것)
2A 통합) 내선 JS 3.4

(1)를 사용하여 내 솔루션)을 설정 프록시 API (읽기 : true)
2b) doRequest 메서드를 재정의합니다. 거기서 google.maps.PlacesService.textSearch를 호출 할 수 있습니다.
2c) 리더를 사용하여 장소 요청 처리 (사용자 정의 리더를 만들었습니다)
3) 데이터를 저장소에 저장합니다. 내 맞춤 상점)
4) 상점에서 데이터를 소비하는 구성 요소 생성

애플리케이션이 Google Maps/Google 어스 API 서비스 약관을 준수해야한다는 점에 유의하십시오. (당신은 로고, 제 3 자 권리 보유자 등을 보여줘야합니다.)

거기 있습니다!

+0

google.maps.PlacesService를 사용하여 장소를 검색 하시나요? PlacesService 사용에 대해 약간 혼동 스럽거나 google.maps.places.AutocompleteService 클래스를 사용하여 장소 예측을 검색합니다. 당신이 알아 낸 것이라면 약간의 코드 스 니펫을 줄 수 있습니까? 텍스트 필드에 자동 완성을 표시하는 방법을 알고 싶습니다. 전에 고마워 ... –

+0

기본적으로 사용자 정의 저장소, 프록시 및 독자에 대한 내용은 구성 요소가 Ext JS에서 데이터를 사용하는 방식이기 때문입니다. 이러한 개념을 알고 있는지 확인하십시오. Ext.form.TextField는이 구성 요소에 정보를 저장하는 옵션이 없기 때문에 즉시 작동하지 않습니다. 내 자신 Ext.form.ComboBox를 사용하여 솔루션에 갔었 어. 정확하게이 문제에 대한 작은 라이브러리를 만들었 기 때문에 내 전체 코드를 게시하는 것이 복잡 할 수 있습니다. – Bashful

+0

예, 필자는 텍스트 필드에서 자동 완성 기능에 대해 잘 알고 있습니다. 여러 번 시도했기 때문에 요소를 검사 할 때 데이터 예측을 얻지 만 예측이 나타나지 않았습니다. xtype : textfield를 사용하면 작동하지 않지만 콤보 상자 사용에 관해 언급 한 것처럼 전체 코드가 아닌 약간의 코드 스 니펫을 제공 할 수 있습니다. 데이터 프록시가 자동 완성 예측을 검색하기위한 코드 스 니펫 일뿐입니다. 감사. –

관련 문제