web-dev-qa-db-fra.com

Événement Blazor onchange avec liste déroulante sélectionnée

J'ai donc été bloqué en essayant d'obtenir un simple onchange à déclencher lorsqu'une valeur de liste déroulante sélectionnée change. Ainsi:

<select class="form-control d-flex" onchange="(dostuff())">
    @foreach (var template in templatestate.templates)
    {
        <option [email protected]>@template.Name</option>
    }
</select>

la méthode étant appelée:

void dostuff()
{
   Console.WriteLine("first spot is firing");
    _template = templatestate.templates.FirstOrDefault(x => x.Name == 
    _template.Name);
    Console.WriteLine("second spot is firing");
}

Le résultat que je comprends, peu importe comment j'essaye de le réorienter, c'est cette erreur dans le navigateur.

Uncaught Error: System.ArgumentException: There is no event handler with ID 0

Y a-t-il quelque chose d'évident et de clé qui me manque? Parce que j'ai un bouton onclick qui fonctionne très bien dans la même page.

16
Grand Masta1

Votre réponse devrait être dans le cshtml:

<select onchange=@DoStuff>
    @foreach (var template in templates)
    {
        <option value=@template>@template</option>
    }
</select>

Ensuite, vos @functions devraient ressembler à:

@functions {
    List<string> templates = new List<string>() { "Maui", "Hawaii", "Niihau", "Kauai", "Kahoolawe" };
    string selectedString = "Maui";

    void DoStuff(UIChangeEventArgs e)
    {
        selectedString = e.Value.ToString();
        Console.WriteLine("It is definitely: " + selectedString);
    }
}

Vous pouvez également simplement utiliser une liaison ...

<select bind="@selectedString"> 

mais onchange = @ DoStuff vous permet d'effectuer une logique sur la sélection.

4
Patrick Knott

Pour commencer, vous n'utilisez pas la syntaxe de liaison correcte:

onchange="@dostuff"

remarquez le @

0
Flores

La réponse ci-dessus n'a pas fonctionné pour moi, a obtenu une erreur de compilation.

ci-dessous est mon code de travail.

@inject HttpClient httpClient

@if (States != null)
{

<select id="SearchStateId" name="stateId" @onchange="DoStuff" class="form-control1">
    <option>@InitialText</option>
    @foreach (var state in States)
    {
        <option value="@state.Name">@state.Name</option>
    }
</select>
}


@code {
[Parameter] public string InitialText { get; set; } = "Select State";
private KeyValue[] States;
private string selectedString { get; set; }
protected override async Task OnInitializedAsync()
{
    States = await httpClient.GetJsonAsync<KeyValue[]>("/sample-data/State.json");
}

private void DoStuff(ChangeEventArgs e)
{
    selectedString = e.Value.ToString();
    Console.WriteLine("It is definitely: " + selectedString);
}

public class KeyValue
{
    public int Id { get; set; }

    public string Name { get; set; }
}
}
0
Pankaj Rawat