web-dev-qa-db-fra.com

ONCHANGE ÉVÉNEMENT NE PAS TRAILLER BLAZOR INTERPENSELLECT

J'ai le code suivant pour une intrigueSélectionner

               <InputSelect class="form-control form-control form-control-sm"
                             placeholder="Role"
                             disabled="@IsReadOnly"
                             @bind-Value="Model.Role"
                              @onchange="@RoleChanged">
                    <option value="Member">Member</option>
                    <option value="Admin">Admin</option>
                    <option value="Pioner">Pioneer</option>
                    <option value="Retailer">Retailer</option>
                </InputSelect>

Et pour le code:

bool ShowCreated;
bool ShowUpdated;
bool IsReadOnly;
string SelectedRole;

public EditForm AccountForm;
public Multi.Dtos.RegistrationDto Model = new Dtos.RegistrationDto() { Role = "Member" };

public void RoleChanged(ChangeEventArgs e)
{
    SelectedRole = e.Value.ToString();
    Console.WriteLine(e.Value);
}

La fonction Rolechange n'est pas invoquée lorsque j'essaie de sélectionner un nouvel élément. Quelqu'un peut-il souligner ce qui ne va pas avec ça. La valeur du bon a changé, mais l'événement n'a pas été appelé.

c#asp.net-coreblazorblazor-server-side
8
Edu Cielo

La demande n'est pas si ancienne, vous pouvez donc prendre en compte les éléments suivants qui fonctionnent avec EdiDIn (essentiellement connecter sur un autre événement) => à Oninput EventHandler, vous passez le vareceventargs var, et vous pouvez ainsi obtenir la valeur pour traiter.

<InputSelect @bind-Value="@labBook.StockID" @oninput="OnLabbookStockChange" class="form-control">
                            @if (lstStocks != null)
                                {
                                <option value="">select...</option>
                                @foreach (var stock in lstStocks)
                                    {
                                    <option value="@stock.StockID">@stock.TestArticle.TAName</option>
                                    }
                                }
                        </InputSelect>
3
gericooper

Noter:

  • InputSelect est un élément composant, pas d'élément HTML, c'est pourquoi vous ne pouvez pas m'appliquer à la directive @onchange Compiler. Cette directive est appliquée à des éléments, généralement mais pas nécessairement avec l'attribut de valeur pour former la fixation de données à deux sens.

  • @ Bind-Valeur est une directive directive du compilateur instructant le compilateur de produire du code permettant une liaison de données bidirectionnelle entre les composants. Appliquer @ Bind-Valeur au composant InputSelect vous nécessite (déjà effectué dans ce cas par l'équipe Blazor) pour définir une propriété de paramètres nommée Valeur et un "délégué" EventCallback, Nommé conventionnellement valorecète. La valeur et la valeur de valeur sont des propriétés du composant InputSelect.

Il y a plusieurs façons de faire ça:

 <InputSelect ValueExpression="@(()=>comment.Country)" 
                                           Value="@comment.Country" 
                 ValueChanged="@((string value) => OnValueChanged(value ))">
        <option value="">Select country...</option>
        <option value="USA">USA</option>
        <option value="Britain">Britain</option>
        <option value="Germany">Germany</option>
        <option value="Israel">Israel</option>
 </InputSelect>

Et

 private Task OnValueChanged(string value)
{
    // Assign the selected value to the Model 
    comment.Country = value;
   return Task.CompletedTask;
}

Vous pouvez également implémenter inotifypropertychanged.propertychanged événement dans votre modèle, comme l'a suggéré Dani Herrera. Vous le faites si vous voulez supprimer les composants des formulaires, y compris l'EDITFORM, et utilisez plutôt les balises HTML normales, auquel cas vous pourrez faire quelque chose comme:

<input type="text" value="@MyValue" @onchange=OnChange"/>

Bien sûr, votre classe de modèle va être épaisse et elle devrait communiquer avec l'EditContext ....

J'espère que cela t'aides...

1
enet