Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: Google autocomplete places example ?

  1. #1
    Sencha User
    Join Date
    Nov 2011
    Posts
    37
    Vote Rating
    1
      0  

    Default Google autocomplete places example ?

    Hello Everyone ,

    I have a requirement just like google auto complete places . I found a example which is similar to that
    http://dev.sencha.com/deploy/ext-4.0...um-search.html

    In the above example http://www.sencha.com/forum/showthread.php returns a JSON object which can be seen .

    I am trying to modify the url with my goggle map key as suggested here http://code.google.com/apis/maps/doc...ocomplete.html

    But I am getting request denied error . Can some one please help me . Is there any better example other than this?

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,381
    Answers
    3997
    Vote Rating
    1536
      0  

    Default

    Google is saying that your request is denied? Is the request valid for the google service?
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    Nov 2011
    Posts
    37
    Vote Rating
    1
      0  

    Default

    ok i have changed the url now
    Ext.onReady(function(){

    Ext.define("Post", {
    extend: 'Ext.data.Model',
    proxy: {
    type: 'jsonp',
    url : 'http://maps.googleapis.com/maps/api/geocode/json?address=Hyderabad,+&sensor=false',

    reader: {
    type: 'json',
    root: 'results'
    //totalProperty: 'totalCount'
    }
    },

    fields: [
    {name: 'id', mapping: 'long_name'},
    {name: 'title', mapping: 'short_name'},
    {name: 'topicId', mapping: 'types'}
    ]});

    ds = Ext.create('Ext.data.Store', {
    pageSize: 10,
    model: 'Post'
    });

    panel = Ext.create('Ext.panel.Panel', {
    renderTo: Ext.getBody(),
    title: 'Search the Ext Forums',
    width: 600,
    bodyPadding: 10,
    layout: 'anchor',

    items: [{
    xtype: 'combo',
    store: ds,
    displayField: 'title',
    typeAhead: false,
    hideLabel: true,
    hideTrigger:true,
    anchor: '100%',

    listConfig: {
    loadingText: 'Searching...',
    emptyText: 'No matching posts found.',

    // Custom rendering template for each item
    getInnerTpl: function() {
    return '<a class="search-item" href="http://maps.googleapis.com/maps/api/geocode/json?address=Hyderabad,+&sensor=false">' +
    '<h3><span>{[Ext.Date.format(values.lastPost, "M j, Y")]}<br />by {author}</span>{title}</h3>' ;


    }
    },
    pageSize: 10
    }, {
    xtype: 'component',
    style: 'margin-top:10px',
    html: 'Live search requires a minimum of 4 characters.'
    }]
    });
    });


    Now I m getting invalid lable results

  4. #4
    Sencha User
    Join Date
    Nov 2011
    Posts
    37
    Vote Rating
    1
      0  

    Default

    any suggestions ?

  5. #5
    Sencha User
    Join Date
    Nov 2011
    Posts
    37
    Vote Rating
    1
      0  

    Default

    any other ideas ?

  6. #6
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
      0  

    Default

    I tried the similar coding.

    The API I used is for Google Places API though.
    The accepted URL by Google is something like this:
    https://maps.googleapis.com/maps/api/place/search/json?input=australia&sensor=false&key=xxx

    However, when the URL is sent, extjs jsonp attached that URL with more parameters:
    https://maps.googleapis.com/maps/api/place/search/json?input=australia&sensor=false&key=xxx&_dc=1332938107714&query=test&page=1&start=0&limit=10&callback=Ext.data.JsonP.callback1

    Google returned 200OK with "Status: Invalid Request".
    I believed Google doesn't allow that URL with extra parameters.

    Is there any workaround to disable the default attachment of the extra parameters by the jsonp ?
    or perhaps another URL request method is needed ?

  7. #7
    Sencha User
    Join Date
    Nov 2011
    Posts
    37
    Vote Rating
    1
      0  

    Default

    @mrmaoii

    Have you found any solution ????

  8. #8
    Sencha User
    Join Date
    Mar 2012
    Posts
    3
    Vote Rating
    0
      0  

    Default invalid label

    @chot2: still working on it...

    There's a typo in my previous post where the request should be :
    https://maps.googleapis.com/maps/api/place/autocomplete/json?input=australia&sensor=false&key=xxx

    Now I'm getting the similar "invalid label" error in FireFox or an "expecting ';' " error in IE.

    Is there a specific data format that jsonp is expecting ?

  9. #9
    Sencha User
    Join Date
    Nov 2011
    Posts
    37
    Vote Rating
    1
      0  

    Default

    Even i m not sure about that . It would be better if some who have already implemented it would tell us

  10. #10
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,381
    Answers
    3997
    Vote Rating
    1536
      0  

    Default

    Does it support JSONP?
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

Page 1 of 2 12 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •