I have a Blazor WebAssembly app using IgbGrid. I need to pass the results of the RowEditDoneScript from the JavaScript script to a .Net method for processing. I have code that can successfully pass a string to .Net, but it fails if I try to pass the event args. Here are the relevant parts of the code that works:
event.js
var GLOBAL = {};GLOBAL.DotNetReference = null;GLOBAL.SetDotnetReference = function (objRef) { GLOBAL.DotNetReference = objRef;};
igRegisterScript("EvtRowEditDone", (event) => { var d = event.detail; GLOBAL.DotNetReference.invokeMethod("ProcessEvt", "Hello");}, false);
EvetTicketEdit.razor
@page "/eventticketedit"@implements IDisposable@inject IJSRuntime js
//in grid def
RowEditDoneScript="EvtRowEditDone" RowEditable="true"
private DotNetObjectReference<EventTicketEdit>? objRef;
protected async override Task OnAfterRenderAsync(bool firstRender) { var grid = this.grid; if (firstRender) { objRef = DotNetObjectReference.Create(this); await js.InvokeVoidAsync("GLOBAL.SetDotnetReference", objRef); } }
[JSInvokable("ProcessEvt")] public void ProcessEvt(string x) { }
public void Dispose() { objRef?.Dispose(); }
If I change the script to:
igRegisterScript("EvtRowEditDone", (event) => { var d = event.detail; GLOBAL.DotNetReference.invokeMethod("ProcessEvt", event);}, false);
And change the .razor code to:
[JSInvokable("ProcessEvt")] public void ProcessEvt(IgbGridEditDoneEventArgs x) { }
It appears to run successfully, but the EventArgs fields contain no data. In the script, I can see data in event.detail, but detail is blank at the ,Net end.
Can you provide an example of how I should be passing this data?
Okay. Success. I changed the grid entries to:
RowEditDone="EvtRowEditDone" RowAdded="EvtRowAdded" RowDeleted="EvtRowDeleted"
and changed my event handlers to:
protected void EvtRowAdded(IgbRowDataEventArgs e) { }
protected void EvtRowEditDone(IgbGridEditDoneEventArgs e) {
}
protected void EvtRowDeleted(IgbRowDataEventArgs e) {
and now they're firing.
I also added these three statements to the grid definition, but I'm assuming these are just for overriding the defaults if you have more than one grid on a page. Still no success.
RowEditDone="RowEditDone" RowAdded="RowAdded" RowDeleted="RowDeleted"
Okay. I've added these events to my razor page, but none of them seem to be firing. Do I need to do anything additional?
protected void RowAdded(IgbRowDataEventArgs e) { }
protected void RowEditDone(IgbGridEditDoneEventArgs e) {
protected void RowDeleted(IgbRowDataEventArgs e) {
Hello Brad,
The documentation currently covers the Row Editing feature of the IgbGrid here: https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/grids/grid/row-editing.
It does not really mention the RowEditDone event at the time of writing this though, outside of a mention in the API References section of the topic. Here is a link to the API listing the RowEditDone event as well: https://www.infragistics.com/blazor/docs/api/api/IgniteUI.Blazor.Controls.IgbGridBaseDirective.html#IgniteUI_Blazor_Controls_IgbGridBaseDirective_RowEditDone.
Please let me know if you have any other questions or concerns on this matter.
Thanks. I wasn't aware that there was a RowEventDone event available. Can you tell me where this is covered in the documentation? I haven't seen this covered in the documentation that I've been looking at, and I'd be happy to be directed to additional sources.