CODEWITHSUNDEEP
javascriptarraysangulartypescriptangular8
Bitly
Bitly

Reputation: 948

Send checkbox selection to array inside object as string

I have a complex object of structure

JSON{
     alpha{
           array1[
                  obj1{},
                   obj2{}
                 ]
          }
   }

Along with array1 I want send another array: array2 which will only contain strings. So the structure would be like:

JSON{
     alpha{
           array1[
                  obj1{},
                   obj2{}
                 ],
           array2[
                  "string1",
                  "string2"
                 ]
          }
   }

In HTML I have 2 checkboxes. If user selects a checkbox the flag is set to true. Now for the checkbox whose flag is true, I want to send a string into array2 which I want to push into this complex json structure.

<input type="checkbox" value="ABC" name="ABC" [(ngModel)]="firstThreeAlphabets" (change)=isSelected1($event)>
<input type="checkbox" value="XYZ" name="XYZ" [(ngModel)]="lastThreeAlphabets" (change)="isSelected2($event)>

In TS File I have implemented

abc: boolean;
xyz: boolean;
ngOnInit(){
this.abc = false;
this.xyz = false;
}
isSelected1(event){
if (abc = true) {
   this.array2.abc = 'First three alphabets are ABC';
}else {
   this.array2.abc = '';
}
}
isSelected2(event){
if (xyz = true) {
   this.array2.xyz = 'Last three alphabets are XYZ';
}else {
   this.array2.xyz = '';
}
}

I am successfully able to push array2 into the complex object. Now the issue is, abc and xyz are always set to true even when I uncheck it. Thus the if condition is always true. Thus my functionality is breaking In TS file, I want to set something like: if firstThreeAlphabets is selected I want to set a variable and assign the following string: First three alphabets are A,B,C and if second checkbox is selected the following string will be stored in array2: Last three alphabets are X,Y,Z If both are selected I have to send two strings to array2. Once stored in Array, I have to push the array into the complex object as shown and pass that final object into the post request.

Upvotes: 0

Views: 284

Answers (2)

Chandradeepta Laha
Chandradeepta Laha

Reputation: 386

I have changed your code a little, please have a look https://stackblitz.com/edit/angular-ce3wy8

Upvotes: 1

Chandradeepta Laha
Chandradeepta Laha

Reputation: 386

From what I understood, create an empty array and push the selected values into that array. Then replace that array with array2 in your object.

Upvotes: 0

Related Questions