时间戳

首页 > 解决方案 > 如何在 blazor 中通过外部代码设置选择框值？

blazor - 如何在 blazor 中通过外部代码设置选择框值？

问题描述

我正在使用TelerikDropDownList并且我想通过事件通过外部代码（手动，没有用户界面）设置选择框值。

     <TelerikDropDownList Id="TelerikDropDownListId"
                          @bind-Value="@Model.Id"
                          Data="@DataDropDownList"
                          ValueField="Value"
                          TextField="Text"
                          @ref="TelerikDropDownListId"/>

     <button @onclick="ChangeSelectBoxValue" />

     @code {

         public List<DropDownItem<long>> DataDropDownList = new List<DropDownItem<long>>();

         private void ChangeSelectBoxValue()
         {
             DataDropDownList.Add(new DropDownItem<long>() { Value = 0, Text = "(New)" });

             TelerikDropDownListId.TextField = "(New)";
             TelerikDropDownListId.Value = 0;

             StateHasChanged();
        }
     }

标签： blazortelerik-blazor

解决方案

您需要在列表中添加新项目，但更改您传入@bind-Value的值而不更改组件 ref 的值。

private void ChangeSelectBoxValue()
{
    // add new item to the drop down list
    DataDropDownList.Add(new DropDownItem<long>() { Value = 0, Text = "(New)" });

    // change the value of the drop down
    Model.Id = 0; // same Value as the item added in the drop down list

    StateHasChanged();
}

推荐阅读