fix: force position in FluentSelect

[mdtal]

🐛 Bug Report

With FluentSelect, I set the bound value of a to null to reset my drop down to the unchosen placeholder value without re-initializing the Items.
Doesn't seem to work with new release.

💻 Repro or Code Sample

seems your example page for Forms & Inputs -> List -> Select -> Forced Position is also not working

🤔 Expected Behavior

it used to reset the dropdown to virgin state with the placeholder shown

😯 Current Behavior

now it just stays on the selected item

💁 Possible Solution

🔦 Context

holding on this release

🌍 Your Environment

• OS & Device: Windows 11 PC, Visual Studio 2022, Blazor Wep App Core 8
• Browser Chrome 132.0.6834.197
• .NET Core 8.0.406
• Fluent UI Blazor library Version 4.11.4

[vnbaaij]

Sorry, but you are describing an issue and then in the repro step you are talking about something completely different.

We need clear, ready-to-run reproduction steps and code. Standard reply below:

---

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.

[mdtal]

ok, using the Blazor Web App Template in VS2022, I created BlazorApp1
had to add "@using Icons = Microsoft.FluentUI.AspNetCore.Components.Icons" to the _Imports.razor
copied code from your web page into Home.razor

@page "/"

<PageTitle>Home</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new Fluent Blazor app.
<FluentDivider />
<br />  

@* Code from https://www.fluentui-blazor.net/Select#forcedposition *@

<h4>Forced position above</h4>
<FluentSelect Position="SelectPosition.Above" @bind-Value="@selectValue" TOption="string">
    <FluentOption>Position forced above</FluentOption>
    <FluentOption>Option Two</FluentOption>
</FluentSelect>

<h4>Forced position below</h4>
<FluentSelect Position="SelectPosition.Below" @bind-Value="@selectValue" TOption="string">
    <FluentOption>Position forced below</FluentOption>
    <FluentOption>Option Two</FluentOption>
</FluentSelect>

@code {
    private string selectValue { get; set; }
}

I would expect that selecting "Option Two" from the above box would force the below box to "Option Two" also.
It does not, but it used to work before Version 4.11.4

BlazorApp1.zip

[vnbaaij]

Maybe it worked like that before but that was then an unexpected side effect.
With the code as you have it above, it won't work like that. None of the options has an actual value so @bind-Value won't do anything. There is no binding taking place.

[mdtal]

since this code was copied from your example website, maybe you should change the site?

[vnbaaij]

Why? It is not supposed to show/do what you are describing. It is to show you can force the list to display above or below the input box.

[mdtal]

I am old and you are correct, my bad and much thanks for your work.