fix: FluentSelect fails in SSR forms about fluentui-blazor HOT 8 CLOSED

Hi,

Thanks for your report, but...

Please supply us with ready-to-run reproduction code in the form of something we can copy/paste, a (zipped) project structure or a GitHub repository.

We do not have capacity to craft or compose a reproduction for every issue that gets raised.

If no code or repository is provided, this issue will be closed in 3 days

Help us to help you. Thanks.

from fluentui-blazor.

Sure. The attached is the latest version of the your template with the starship-3 code from the MS site pasted into the home page to run in SSR mode and a Starship.cs model added.

In the example code the InputSelect populates Starship.Classification.

I added Starship.Classification2 with a FluentSelect right below the InputSelect on the page. One always works, the other never populates Model.Classification2 in the Submit method (I've tried several variations). If you uncomment the rendermode at the top to make it interactive it works correctly.

SSRFormSelectIssue.zip

from fluentui-blazor.

Thanks for supplying the details. We'll taka a look soon.

from fluentui-blazor.

I did a bit of digging into the submit event in the browser and your project source.

The docs note that in SSR mode it is necessary to explicitly assign the Name parameter of the fluent components in forms. In your source code, in components like FluentTextField.razor, you can see the assignment of that parameter to the underlying component, "name=@name", in the component initialization. None of the list components in the List folder (FluentSelect.Razor, etc.) have that assignment in their definition.

When intercepting the submit event of the form in the browser (using the zip I attached above) it is possible to see that the name property of the InputSelect is (auto) configured to match the binding needed in the form processed by FormData and posted back. The Fluent List component below that has a blank name when submitted to FormData and is then not posted back.

I conjecture this lack of "name=@name" in the List component definitions is at least part of the issue I am seeing although I have not rebuilt the library to test.

Great components by the way. Loving the way they come together with the Blazor component model in the UI.

from fluentui-blazor.

I did not have time to look at this in depth yet, but was expecting the name to be the culprit indeed.

The list based components (as all FluentComponentBase components) implement the additional attributes collection so you should be able to specify the name attribute yourself (for testing without rebuilding the library).

from fluentui-blazor.

That worked. Appreciate the assist.

from fluentui-blazor.

@rhealthyme I download the code and try to add Name to the FluentCombobox but it doesnt works, can you help me plis ?

from fluentui-blazor.

from fluentui-blazor.