3

I am using ionic 3 and i want to get the input and add some autocomplete on it using google maps. I have the following alert in my .ts file.

let alert = this.alertCtrl.create({
    title: 'Offer a Ride',
    inputs: [
      {
        name: 'From',
        placeholder: 'From',
        id: 'From'
      },
      {
        name: 'To',
        placeholder: 'To',
        type: 'text',
        id: 'To'
      },
      {
        name: 'Date',
        placeholder: 'Date',
        type: 'date'
      }
    ],
    buttons: [
      {
        text: 'Cancel',
        role: 'cancel',
        handler: data => {
          console.log('Cancel clicked');
                elem.style.filter='none';
        }
      },
      {
        text: 'Offer',
        handler: data => {
          elem.style.filter='none';
          var from = data.From;
          var to = data.To;
          //this.navCtrl.setRoot (TabsPage, {from:from, to:to});
            let toast = this.toastCtrl.create({
            message: 'Location was set Successfully',
            duration: 3000
          });
          toast.present();
        }
      }
    ]
  }); 

I want to do the following:

var autocomplete;
autocomplete = new google.maps.places.Autocomplete(
          (document.getElementById('From')),
          {types: ['geocode']});

However, I cannot get the input of id 'From'. Any idea how to do this?

Suraj Rao
  • 29,388
  • 11
  • 94
  • 103
moustafa
  • 251
  • 2
  • 11
  • 1
    Don't use an alert, [it's not recommended](https://ionicframework.com/docs/api/components/alert/AlertController/#alert-inputs) and a modal will give you more control. The answer [here](https://stackoverflow.com/questions/42427915/ionic-2-google-places-and-autocomplete-location) provides a full implementation of autocomplete using a modal. – jme11 Mar 04 '18 at 02:52

1 Answers1

0

I am not able to get you. You can access the "From" field value inside the button handler, right?

Do you want to access the "From" field outside the handler? In that case you can either use a global variable or a service to access the value.

Or do you want to access the field value by id? In that case, theres an issue with the alert controller. The id attribute is never written to the DOM for the alert. Theres a bug reported for the same on the github.

Here's the link AlertController - Input missing id attribute from Input Options

Not sure if it answers your question.

Deepak Terse
  • 652
  • 8
  • 30