Adding Geo info to Ionic 2 form

@Thomas2017 wrote:

I am doing some testing and with the following code I can submit my data to a server and receive a response with text inputs into the form fields. When I click my Get Location button I get lats and longs as variables. In jQuery I was able to use "document.getElementByName("lat").value = position.coords.latitude;" to insert this data into the Latitude form field. What would be the Ionic 2 way of inserting the results of this function into this form field

<ion-list>
   <ion-item>
      <ion-input type="text" name="lat" placeholder="Latitude" [(ngModel)]="data.lat"></ion-input>
   </ion-item>

   <ion-item>
     <ion-input type="text" name="lng" placeholder="Longitude" [(ngModel)]="data.lng"></ion-input>
  </ion-item>

  <ion-item>
     <ion-input type="text" name="message" placeholder="message" [(ngModel)]="data.message"></ion-input>
  </ion-item>

  <button (click)="getLocation()" class="button button-full button-calm">Get Location</button>

  <button block (click)="submit()">Submit to server</button>
</ion-list>


export class FormstuffPage {
  constructor(@Inject(Http) http: Http) {
    this.data = {};
    this.data.message = '';
    this.data.lat = '';
    this.data.lng = '';
    this.data.response = '';
    this.http = http;
  }

  submit() {
      let link = 'http://api.php';
      let data = JSON.stringify({message: this.data.message, lat: this.data.lat, lng: this.data.lng});
      this.http.post(link, data)
      .subscribe(data => {
        this.data.response = data._body;
      }, error => {
          console.log("error");
      });
    }

  getLocation() {
    let options = {timeout: 2000, enableHighAccuracy: false};
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(geoLatlng, geoErrors, options);
    } else {
        console.log "conection error"
    }
  }

  function geoLatlng(position) {
      let latitude = position.coords.latitude;
      let longitude = position.coords.longitude;
      console.log ('cordinates'latitude,longitude);
  }

  function geoErrors(error) {
  }
}

Posts: 1

Participants: 1

Read full topic