SfSidebar "Pages" SfButton AddEventListener is not a Function

[David Diehl]

Hello,

Hoping I can explain this well enough: I have an SfSidebar component. The Sidebar has multiple "pages". Those pages are handled via C# code; @{ if(page == "foo") { render bar... } else if(page == ...

Buttons at the bottom of the page are outside of the if/else component render logic.

On initial render, the button Next can progress to the next page. However, the very next click (next or previous) generates a t.addEventListener is not a function error. I've tried a few things including a StateHasChanged() on the page change function, no luck. Any help greatly appreciated!

Initial render:

After page change:

Development code, not proud
<SfButton id="unique" @ref="ProductionButton" @onclick="ChangePageToProduction" CssClass="footer-button" >
				Previous
</SfButton>

private void ChangePageToLosses(Microsoft.AspNetCore.Components.Web.MouseEventArgs args) { ChangePage("losses"); }
private void ChangePageToProduction(Microsoft.AspNetCore.Components.Web.MouseEventArgs args) { ChangePage("production"); }
private void ChangePage(string newPage)
{
	if (newPage == "production")
	{
​
                //do stuff		
                page = newPage;
	}
	else if (newPage == "losses")
	{
		//do stuff
		page = newPage;
	}
	else
	{

	}
	StateHasChanged();
}





[Praveen Sellappan]

Hi David,

Greetings from Syncfusion Support.

We understand that you're encountering an error when using the Syncfusion components.

To investigate the issue you reported, we prepared a sample that closely replicates the setup you described, including the code you shared. When testing the sample particularly on button click. We did not observe any of the errors you mentioned. We tested this in the latest version of our packages.

We’ve attached the sample for your reference.

Sample:  https://blazorplayground.syncfusion.com/BjLdDLLZIJBxlHtH

Kindly review the sample.

If the issue still occurs on your side, it would greatly help our investigation if you could provide the following details:

• The exact version of the Syncfusion packages you are using
• The environment used to test your application (browser, OS, .NET version, etc.)
• A short video demonstrating the issue.
• A minimal, issue-reproducible sample
• Confirmation of whether you can reproduce the issue in the sample we shared

We look forward to your feedback so we can assist you further.

Regards,

Praveen Sellappan

[David Diehl]

After additional troubleshooting, the error is coming from this specific line of code (circled red). When this portion of code is removed the ability to switch pages via button click works. Even after reducing this to the most basic implementation of SfNumericTextBox the issue persists.

[David Diehl]

The issue was caused by trying to pass a complex argument to the "Value" parameter.

Value=@(val == 1 ? Parameter1 : Parameter2)

Solution was to nest two different SfNumericTextBox into an If statement testing for the "val" condition.

[Kundurthi Naga Siddartha Kundurthi Vennela Prasad]

Hi David Diehl,

We’re glad to hear that you were able to identify the root cause of the issue and resolve it by adjusting the usage of the Value parameter with conditional rendering.