CODEWITHSUNDEEP
javascriptangular
Mahmud
Mahmud

Reputation: 383

Cannot set property 'location' of undefined

I have an add form where I am taking input location and others data. In service.ts I have declared

export class SBOrderViewModel {
location: string;
agent: string;
}

In add.component.ts

sboVM: SBOrderViewModel;
this.addForm = this.formBuilder.group({
      location: [],
      agent: [],
       });

whenever submit the data from frontend it will go to onSubmit() function in add.componet.ts

onSubmit() {

    this.sboVM.location = this.addForm.value.location;
    this.sboVM.agent = this.addForm.value.agent;
    this.sboService.Insert(this.sboVM).subscribe(
      data => {
        this.router.navigate(['/sborder/']);
      },
      this.errHandler.bind(this)
    );
  }

In add.componet.html

 <form #addorder [formGroup]="addForm" clrForm clrLayout="horizontal">
            <clr-input-container>
            <label>Location</label>
            <input class="txtboxwidth" formControlName="location" clrInput type="text" name="location"/>
          </clr-input-container>
    <button class="mrgnlft btn btn-success" [disabled]='addForm.invalid' *ngIf="btnvisibility" type="submit" (click)="onSubmit()">Save</button>
     </form>

I can't figure out why it shows Cannot set property 'location' of undefined when I add the value in addform and submit. Your kind help will be highly appreciated

Upvotes: 1

Views: 339

Answers (3)

Ale_Bianco
Ale_Bianco

Reputation: 655

You have to initialize the variable this.sboVM

In the constructor add: this.sboVM = new SBOrderViewModel();

Upvotes: 1

hanan
hanan

Reputation: 1880

Seems like this.sboVM is null in onSubmit function. enter image description here

bcs other that ur code is working

enter image description here

Upvotes: 1

dipendra
dipendra

Reputation: 251

You can check by updating below code in add.component.ts

this.addForm = new FormGroup({
      location: new FormControl(null, [])
      agent: new FormControl(null, [])
     });

Upvotes: 0

Related Questions