Comments (6)
I prefer not to add an EventCallback
as I think it’s best to let the consuming developer decide if they want to call StateHasChanged
rather than forcing it on them.
Could you provide some example code of what you’re attempting?
from typeahead.
Hi!
Sure. I bet this is an easy task, I just need help to figure it out.
index.razor
`@page "/"
@if (Equals(SelectedProjekt, null).Equals(false))
{
@SelectedProjekt.DisplayName
ProjektComponent.razor
`
@Inject Data.Services.ProjektService ProjektService
<BlazoredTypeahead SearchMethod="@find" MinimumLength="3" Placeholder="Sök" @bind-Value="SelectedProjekt">
@context.Kund.Name - @context.DisplayName
@context.Kund.Name - @context.DisplayName
@if (Equals(SelectedProjekt, null).Equals(false))
{
if (ShowSelectedDetails)
{
from typeahead.
Ok I think this should work or at least get you most of the way there.
In your ProjektComponent
you need to add the below into the code
section:
private Data.Projekt _selectedProject;
[Parameter] protected Data.Projekt SelectedProjekt
{
get => _selectedProject;
set
{
_selectedProject = value;
OnProjectChanged?.Invoke(_selectedProject);
}
}
[Parameter] Func<Data.Projekt> OnProjectChanged { get; set; }
Then in your parent component do this:
<ProjektComponent OnProjectChanged="HandleProjectChanged" />
@if (Equals(SelectedProjekt, null).Equals(false))
{
@SelectedProjekt.DisplayName
}
@code{
/// Here I need an event for ui refresh when selectedprojekt has changed.
Data.Projekt SelectedProjekt { get; set; }
private async Task HandleProjectChanged(Data.Projekt selectedProjekt)
{
SelectedProjekt = selectedProjekt;
StateHasChanged();
}
}
Let me know how you get on.
from typeahead.
Since the Func<Data.Projekt> did not allow me to pass any args when doing invoke I switched to use an Event Handler.
In Child Component
/// <summary>
/// Private Placeholder
/// </summary>
private Data.Projekt _selectedProjekt;
/// <summary>
/// Data Binding
/// </summary>
[Parameter]
protected Data.Projekt SelectedProjekt
{
get => _selectedProjekt;
set
{
_selectedProjekt = value;
OnProjectChanged?.Invoke(this, _selectedProjekt);
}
}
/// <summary>
/// Event Handler
/// </summary>
[Parameter] EventHandler<Data.Projekt> OnProjectChanged { get; set; }
In Parent Component
<ProjektComponent ShowSelectedDetails="true" OnProjectChanged="HandleProjectChanged" >
</ProjektComponent>
@if (Equals(SelectedProjekt, null).Equals(false))
{
<div class="jumbotron">
<p>@SelectedProjekt.DisplayName</p>
</div>
}
@code{
/// <summary>
///
/// </summary>
protected Data.Projekt SelectedProjekt { get; set; }
/// <summary>
/// Event Handler
/// </summary>
/// <param name="sender"></param>
/// <param name="projekt"></param>
void HandleProjectChanged(object sender, Data.Projekt projekt)
{
SelectedProjekt = projekt;
StateHasChanged();
}
}
This seem work like a charm. I have no idéa of if this is a good implementation or not. Any suggestions?
I belive you can close this issue now since there is no need for an event on the result template.
from typeahead.
Glad to hear you got it sorted, I’m not sure why you had an issue with using Func<>
though.
from typeahead.
from typeahead.
Related Issues (20)
- [Question] use input-small bootstrap class and disable autocomplete
- [Question] Is there a way to programmatically select multiple items? HOT 1
- [Bug] When used in a child component in multiselect mode items not added when selected HOT 1
- Have a OnClose Option for the Dropdown list
- [Question] Are you able to just use strings for Value and date related bindings on the control?
- Two way binding
- Typeahead search text dissapearing from search box after displaying results in v 4.7.0 HOT 14
- [Feature Request] Option to disable deleting items with "Backspace" when using MultiSelect
- Method to Force results dropdown to close?
- how to Enable mutli line
- Laptop touchpad not selecting item in results
- Error in "Using complex types but only binding to a single property" HOT 1
- [Bug] - blazored-typeahead results hides behind the modal-footer
- [Bug] Typeahead inside Blazored.Modal search text erase with .NET 7.0 HOT 3
- [Question] How to Justify Dropdown Content
- [Bug] ArgumentNullException after pressing 'backspace' key
- Clicking typeahead inside MudTable in <MudTd> by MudBlazor not set to Focus
- [Bug] Multiple Pasting of text into the control causes app pool to crash
- WORK PAUSED - PLEASE READ BEFORE POSTING AN ISSUE HOT 1
- how to set category id for Searchmethod HOT 1
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 typeahead.