Popover component from c8y websdk

Hi All,

I want to use popover component from websdk. I have set all the popover inputs but not sure how to get the callback on action performed. Has anyone used it? Any pointer would be helpful.

This is my popover code.

 <c8y-popover-confirm  [buttons]="buttons" [isOpen]="showPopover"  [placement]="'bottom'"
    [outsideClick]="true" [title]="'do you want to reset the counter ?'" ></c8y-popover-confirm>


buttons = [ { label: gettext('cancel'), action: () => << want to perform some action >>},
              { label: gettext('yes'), status: 'btn btn-primary btn-sm', action: () => << want to perform some action >>} ]

Thanks
Bishan

The show option of the popover confirm will return a promise value of the action. Meaning you need to access your poConfirm in the controller (either by passing it over in a function or by accessing it via a viewChild):

<button class="btn btn-clean" (click)="handleDelete(poConfirm)">
  <c8y-popover-confirm [buttons]="buttons" #poConfirm></c8y-popover-confirm>
  Delete
</button>

And in the code:

buttons = [ { label: gettext('cancel'), action: () => Promise.resolve(false)},
              { label: gettext('yes'), status: 'btn btn-primary btn-sm', action: () => Promise.resolve(true)} ]

async handleDelete(poConfirm: PopoverConfirm) {
   const result = await poConfirm.show();
   // result contains the value of the action performed. (in this case true or false)
}

Hope that helps,
Jan

1 Like

Hi Jan,

Absolutely. It helped. Thanks a lot!

Thanks
Bishan

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.