Lonna
Lonna

Reputation: 355

formControlName input value undefined

I have a problem with formControlName, I want to submit this form, but one input is undefined, like in photo.

enter image description here

in console look my submit:

enter image description here

I used this code:

<form [formGroup]="addProductForm" (ngSubmit)="onAddProduct()" class="col s12" materialize style="text-align:center">
    <div class="input-field col s12">
      <input formControlName="Quantity" id="Quantity " type="number" class="validate" [(ngModel)]="Quantity">
             </div>
    <div class="input-field col s12">
      <input formControlName="Unit_price" id="Unit_price" type="number" class="validate" [(ngModel)]="Unit_price">
           </div>
    <div class="input-field col s12">
     <div class="c1" style="text-align:left;">
        Subtotal:
      <input formControlName="Subtotal" id="Subtotal" type="number" class="validate" [(ngModel)]="Subtotal" [value]="Quantity*Unit_price">
    </div>
  </div>

  <br>
  <div id="add_contrat_button_container" class="row">
    <button id="add_contrat_button" type="submit" class="button button1">
      Submit
    </button>
  </div>
</form>

Please, can you look and ask me what is the problem in this code, In Subtotal set automatic this value [value]="Quantity*Unit_price" but don't submit. Thank you

Upvotes: 1

Views: 1464

Answers (1)

dnp1204
dnp1204

Reputation: 481

First, you need to remove your ngModel since you already use formControlName. The you check at this link angular2 and formControlName value in template. It may be helpful to you. And I don't understand why you need to do so. I think you should set the value for Subtotal after you submit the form is a better solution. And change the input for subtotal to a normal text field to display it.

Upvotes: 1

Related Questions