Using Menu to provide actions for each row in table does not align properly

Forum rules
Please note that response time for technical support is within 3-5 business days.
Post Reply
sachinpaliwal
Posts: 1
Joined: 22 Sep 2020, 20:26

29 Oct 2020, 00:48

I wanted to use "menu" as possible actions against each row in a table. Below is the template that I am using for body of table:

<ng-template pTemplate="body" let-customer>
<tr class="p-selectable-row">
<td>
<p-tableCheckbox [value]="customer"></p-tableCheckbox>
</td>
<td>
<span class="p-column-title">Name</span>
{{customer.name}}
</td>
<td style="text-align: center">
<button pButton type="button" class="p-button-secondary" icon="pi pi-cog" (click)="menu.toggle($event)"></button>
<p-menu #menu [popup]="true" [model]="menuItems"></p-menu>
</td>
</tr>
</ng-template>

menu item has been initialized in respective file as
this.menuItems = [
{label: 'Edit', icon: 'pi pi-refresh', command: () => {
//this.update();
}}
];

When I run this code the menu works correctly but it does not align correctly with the button on respective row. See image below:
Image

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

30 Oct 2020, 09:51

Hi,

Thanks a lot for the screenshot. Which PrimeNg version are you using? I think this issue is not related to Diamond. Could you please try it without Diamond?

Best Regards,

Post Reply

Return to “Diamond - PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests