Edit a filled form and resubmit it with Ionic/Angular

by

Issue

I work on an Ionic mobile application.
I have a form in which I display data (that data is coming from a webservice). Is it possible to edit that form and then submit it to make it change ?
I tried to do that but didn’t manage to edit the prefilled field (e.g delete a letter or a word, add some characters..) as if the edition was disabled.

Here is the HTML part (example of a textarea) :

<ion-list>

  <ion-item>
    <ion-label >Text area example</ion-label>
    <!-- com field comes from a webservice-->
    <ion-textarea  [(ngModel)]"editcom">{{com}}</ion-textarea>&nbsp;
  </ion-item>  

    <ion-button color"danger" (click)"editForm()" expand"block">OK</ion-button>

</ion-list>

Here is the TS part :

editForm(){
      console.log(this.editcom);
      this.service.postObjets(this.editcom); // send Data to Database
  }

I use that snippet to get data from a GIS WMS Webservice :

  let promise    this.http.get(WMS_Webservice_URL).toPromise();
  await promise
  .then((data)>{
    var com  (data['features'][0]['properties']['com']);
    this.com  com;
  })
  .catch((error)>{
    this.com  '';
  });

Any help would be very appreciated, thanks

Solution

When you are using two way binding, you don’t need to use interpolation. Remove {{com}} and change [(ngModel)]"com". Now any change in textarea, will be effected on com. You don’t need editcom anymore.

Answered By – Qiimiia

Leave a Comment