Ranjith Varatharajan
Ranjith Varatharajan

Reputation: 1694

Dynamic form Issue in Angular

Scenario :

A form is generated dynamically, I used this tutorial to create the form dynamically. When I click "Submit" button, the form value I get in the component is

ts :

  doSubmitICR(form) {
    console.log(form.value);

  }

form.value has the following values

{
 CaptainPoint:"0",
 Category:"restaurant",
 Description:"Test",
 DisplayDept:"kitchen",
 Group:"restaurant",
 GuestPoint:"0",
 ItemCode:"1",
 ItemName:"Test Item",
 PrintingDept:"frontoffice",
 SalesRate:"3",
 SubGroup:"restaurant",
 TAX1:true,
 TAX2:true,
 TabDisplay:"restaurant",
 Unit:"restaurant"
}

TAX1 and TAX2 are dynamic, those form controls were created from a tax table, If the table has TAX3 and TAX4, then instead of TAX1 and TAX2 in the above form, TAX3 and TAX4 form control is generated.

Issue :

  1. If the TAXs are dynamic, how can I pass these values to Web service say WebAPI2 as a model?
  2. Is it possible to filter only the TAX element from the form.value?

Any advice would be appreciated. Thank you.

Upvotes: 0

Views: 50

Answers (1)

Jack Koppa
Jack Koppa

Reputation: 1191

The solution from alexKhymenko should work well. Alternatively, if the values you want to submit to the API will always have the format of TAX{d}, where d is some combination of digits, you could use the following to get just those values on a request object:

let request = {};
Object.keys(form.value).forEach(key => {
    if(/^TAX[\d]+$/.test(key)) 
        request[key] = form.value[key]
});

Upvotes: 1

Related Questions