I want to attach an event handler for each row of a table.
When the user right-clicks on a row
, i want to open a small modal next to that row.
Now in order to do this i do not know how to get the selected row.The documentation shows UIMouseEventArgs
to be used.I see it has only one paramter Type
which i assume is either mousedown
or mouseover
...etc (the type of the mouse event).
How do i get the row on which the user right-clicked?
Table
@inherits DashboardBase
@foreach (var ca in this.campaigns) {
<tr id="@ca.Id" onmousedown="@(async(ev)=>await OnClick(ev,ca))">
<td >@ca.Id</td>
<td>@ca.Name</td>
<td>@ca.State.Tag</td>
<td>@ca.CreatedAtUtc</td>
<td>@ca.IsPaused</td>
@if (this.SelectedId == ca.Id) {
<td><ModalHelper info="@ca"></ModalHelper></td>
@"test string"
}
</tr>
}
public class DashboardBase : BlazorComponent {
protected long SelectedId = -1;
[Parameter]
protected Campaign.Dto.CampaignInfo[] campaigns { get; set; }
protected void OnClick(UIMouseEventArgs args,CampaignInfo campaign) {
if (args.Button != 2) {
return;
}
Console.WriteLine("You pressed right on campaignID:" + campaign.Id);
this.SelectedId = campaign.Id;
this.StateHasChanged();
}
}
Modal
@inherits ModalHelperBase
<div>
<button onclick="@(async()=>await OnDeletePressedAsync())">Delete</button>
</div>
public class ModalHelperBase:BlazorComponent {
[Inject]
private CampaignService campaignService { get; set; }
[Parameter] protected CampaignInfo info { get; set; }
}
Using the code above i can print a text , but if i try to render the component i get the error :
blazor.server.js:23 Uncaught (in promise) Error: System.ArgumentException: There is no event handler with ID 7
at Microsoft.JSInterop.DotNetDispatcher.InvokeSynchronously(String assemblyName, String methodIdentifier, Object targetInstance, String argsJson)
at Microsoft.JSInterop.DotNetDispatcher.BeginInvoke(String callId, String assemblyName, String methodIdentifier, Int64 dotNetObjectId, String argsJson)
at endInvokeDotNetFromJS (blazor.server.js:23)
Try this:
In your OnMousePressed method check which button was clicked.
if ( args.Button == 2) // right button clicked
{
// Code to display your dialogbox
}
As for discovering which row was clicked, you can pass to your OnMousePressed method the value of ca.Id and do something with it.