title: How to calculate multiplication of numbers in a html table below specific headings - IONIC
body: <p><strong>Explanation:</strong> I have a html table with 3 columns namely <code>Price</code> , <code>Quantity</code> and <code>Total</code>. Numers are written below them.</p>
  
  <p><strong>Requirement:</strong> I need to multiply <code>price</code> with <code>Quantity</code> and bring that value in <code>Total</code>. I want to do this while leaving the quantity field or on a key press [as i am typing].</p>
  
  <blockquote>
    <p><strong>Image and code of my form are shared below</strong></p>
  </blockquote>
  
  <p>Image:
  <a href="https://i.stack.imgur.com/wPXnF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wPXnF.png" alt="enter image description here"></a></p>
  
  <p>code of <code>invoice.html</code></p>
  
  <pre><code>&lt;div style="margin-top:15px"&gt;
      &lt;table&gt;
         &lt;tr&gt;
           &lt;th&gt;&lt;/th&gt;
           &lt;th&gt;Price&lt;/th&gt;
           &lt;th&gt;Quantity&lt;/th&gt;
           &lt;th&gt;Total&lt;/th&gt;
  
           &lt;th&gt;&lt;/th&gt;
         &lt;/tr&gt;
         &lt;tr *ngFor="let items of inVoiceItems2;let i=index;"&gt;
           &lt;td&gt;{{i+1}}&lt;/td&gt; 
           &lt;td style="width:198px"&gt;&lt;input type="text" name="price" [(ngModel)]="inVoiceItems2[i].price" style="width:198px;border:0px"/&gt;&lt;/td&gt;
           &lt;td&gt;&lt;input type="text" name="quantity" [(ngModel)]="inVoiceItems2[i].quantity" style="width:198px;border:0px"/&gt;&lt;/td&gt;
           &lt;td&gt;&lt;input type="text" name="total" [(ngModel)]="inVoiceItems2[i].total" style="width:198px;border:0px"/&gt;&lt;/td&gt;
         &lt;/tr&gt;
     &lt;/table&gt;  
  
     &lt;br&gt;
     &lt;input type="button" value="Add New Row" (click)="addRow2()" style="margin-top:5px"/&gt;
     &lt;br&gt;
     &lt;input type="button" value="Calculate Bill" (click)="calculate_bill()" style="margin-top:5px"/&gt;
  
   &lt;/div&gt;
  </code></pre>
  
  <p>code of <code>invoice.ts</code></p>
  
  <pre><code>  addRow2(){
      this.inVoiceItems2.push({'debit':'','credit':''});
    }
  
    calculate_bill(){
  
    }
  </code></pre>