primeNg Checkbox binding object in Datatable

Question

https://www.primefaces.org/primeng/#/checkbox

In the below code I am trying to get the checkboxes to add objects to an array that is in model driven form with the variable name of selectedComponents.

So the object type of item1 below is CampaignProductModel and that is an array called selectedComponents in my model for the form.

I am having trouble binding and added of all checked items to the array in my model object.

 <p-dataTable *ngIf="perviousCampaignProduct" [value]="perviousCampaignProduct" #dt [responsive]="true" filter="filter" [rows]="25" [paginator]="true" selectionMode="single" [(selection)]="selectedItem" [contextMenu]="cm">
    <p-header>Pervious Campaign Products </p-header>
    <p-column header="Images">
        <template let-item="rowData" pTemplate="body">
          <img style="max-height:150px;" src="http://cdnll.somesite.com/images/1000/{{item.itemSku}}.jpg" />
        </template>
    </p-column>
    <p-column field="itemSku" header="Item" [filter]="true" filterMatchMode="contains" filterPlaceholder="Search"></p-column>
    <p-column field="components" header="Components">
       <template let-item="rowData" let-col pTemplate="body">
          <ul style="list-style: none;">
             <li *ngFor="let item1 of item[col.field]">
                <p-checkbox value="item1" formControlName="selectedComponents" label="{{item1.itemSku}}"></p-checkbox>
             </li>
          </ul>
       </template>
     </p-column>
  </p-dataTable>

Goal

Added all check items from p-checkbox as objects to an array in my model driven form.

Tried:

value="{{item1}}"

... knew it won't work

Celso Augusto Klingel · Accepted Answer · 2017-09-12 14:09:57Z

2

It´s a bit later but i think this can resolve your problem Change this code:

 <p-checkbox value="item1" formControlName="selectedComponents" label="{{item1.itemSku}}"></p-checkbox>

for this one:

 <p-checkbox [value]="item1" formControlName="selectedComponents" [label]="item1.itemSku"></p-checkbox>

answered Sep 12, 2017 at 14:09

Celso Augusto Klingel

462 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

primeNg Checkbox binding object in Datatable

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related