Comments (6)
Have you tried calling StateHasChanged()
to inform the user interface of these changes?
I don't think this is related to FluentSelect
.
from fluentui-blazor.
I have just added the StateHasChanged calls to the sample code ... but just like in my own code the problem persists ... on the page I created there are instructions on how to replicate. Let me know if you have issues!
from fluentui-blazor.
After all the testing I went thru yesterday trying to understand what was happening ... as I was having breakfast just now it occurred to me ...
This is the code I'm using to render the select control
<FluentSelect TOption="TestEnum01" ValueChanged="(newValue) => item.TestEnum01 = Enum.Parse<TestEnum01>(newValue)"> @foreach (var value in Enum.GetValues(typeof(TestEnum01))) { <FluentOption Value="@value.ToString()">@value.ToString()</FluentOption> } </FluentSelect>
if the control is never removed out of view, the code associated with ValueChanged doesn't really get updated (it seems) ... and references to old data are still referenced by the function.
It may not be FluentSelect's fault but it feels like some sort of problem in the rendering engine of the platform ... anyways ... this is the best I've come up with to explain the behavior.
from fluentui-blazor.
After all the testing I went thru yesterday trying to understand what was happening ... as I was having breakfast just now it occurred to me ...
This is the code I'm using to render the select control
<FluentSelect TOption="TestEnum01" ValueChanged="(newValue) => item.TestEnum01 = Enum.Parse<TestEnum01>(newValue)"> @foreach (var value in Enum.GetValues(typeof(TestEnum01))) { <FluentOption Value="@value.ToString()">@value.ToString()</FluentOption> } </FluentSelect>
if the control is never removed out of view, the code associated with ValueChanged doesn't really get updated (it seems) ... and references to old data are still referenced by the function.
It may not be FluentSelect's fault but it feels like some sort of problem in the rendering engine of the platform ... anyways ... this is the best I've come up with to explain the behavior.
Have you tried:
@code {
public enum TestEnum01
{
Hello, World
}
private IEnumerable<TestEnum01> _items = Enum.GetValues<TestEnum01>();
private TestEnum01 _selectedEnumValue;
}
<FluentSelect TOption="TestEnum01"
Items="_items"
@bind-SelectedOption="_selectedEnumValue"
@bind-SelectedOption:after="StateHasChanged" />
from fluentui-blazor.
ApacheTec
I updated my repo ... and yes, your suggestion is simpler and it works! Thanks!
I still think that this
<FluentSelect TOption="TestEnum01" ValueChanged="(newValue) => item.TestEnum01 = Enum.Parse<TestEnum01>(newValue)"> @foreach (var value in Enum.GetValues(typeof(TestEnum01))) { <FluentOption Value="@value.ToString()">@value.ToString()</FluentOption> } </FluentSelect>
should NOT generate code that breaks the UI between one user action and the next.
from fluentui-blazor.
Closing this as a working solution is provided (thanks @ApacheTech )
Im not sure if the last example is more s Blazor thing than a specific Fluent issue. Had to do with the foreach and using its iterator inside the loop.
from fluentui-blazor.
Related Issues (20)
- feat: add dynamically recognized type to FluentSelect bind-Value HOT 1
- FluentSortableList demo is failing with error "Sortable is not defined" HOT 1
- docs: add explanation about manually specifying Value property in FluentOption
- feat: add ability to pass in RenderFragment to Toast HOT 1
- FluentProfileMenu does not work in Azure HOT 4
- UpdaDialogAsync does not update anything in the dialog displayed by DialogService HOT 2
- feat: add [Parameter] to/in DataGrid TemplateColumn SortBy HOT 7
- fix: dynamic tabs are not working correctly HOT 1
- fix: FluentSelect is always open when Multiple="true" HOT 5
- fix: DatePicker year selection not working with component within EditForm HOT 1
- FluentDataGrid does not refresh and update after items changed HOT 1
- fix: GridTemplateColumns usage in FluentDataGrid with SelectColumn
- fix: Select all/none from SelectColumn component on multiple mode does not work in a FluentDataGrid component using ItemsProvider. HOT 2
- Fluent emoji nuget package increases ram and disk usage to %100 HOT 3
- fix: Rows render multiple times when DataGrid has changes (performance issue) HOT 2
- fix: Column separator can get hidden when resizing columns in DataGrid HOT 4
- fix: OnRowFocus in FluentDataGrid not triggered HOT 1
- Select not working with CultureInfo en-GB on .NET MAUI blazor hybrid HOT 2
- Wizard in Dialog not editable HOT 1
- Export options for data grid HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fluentui-blazor.