Blazor InputSelect 绑定值并在 select 上更新另一个

Question

在我的 InputSelect 中，我需要能够绑定一个值并在选项选择/单击时更新该值和另一个值。

我的 object 是什么样子的：

public class AccountModel
{
    [Required(ErrorMessage = "Please enter an Office")]
    public Office[] Office { get; set; }
}

public class Office
{
    public string Id { get; set; }
    public string Name { get; set; }

    public Office()
    {
            
    }

    public Office(string _id, string _name)
    {
        Id = _id;
        Name = _name;
    }
}

输入选择：

<p class="m-0 form-details-lbl">Office</p>
        <InputSelect class="m-0 form-control edit-active"
                     @bind-Value="Account.Office[0].Id">
            <option selected disabled>Select Office</option>
                    @foreach (Office office in OfficeLoc)
            {
            <option value=@office.Id @onselect="() => Account.Office[0].Name = office.Name">@office.Name</option>
            }
        </InputSelect>
        <ValidationMessage For="() => Account.Office" />

因此office[0].Id绑定到 InputSelect，但是在 office 列表中的选项 select 上，它将更新 id 和名称。

Answer 1

如果 Account.Office[0] 与您的数组项相同 model，我只需设置整个 object。

<option value=@office.Id @onselect="() => Account.Office = office">@office.Name</option>

如果它们不是同一个 model，我会使用一种方法：

 <option value=@office.Id @onselect="() => SetOffice(office)">@office.Name</option>

@code {
     void SetOffice(Office newOffice){
             Account.Office[0].Id = newOffice.id;
             Account.Office[0].Name = newOffice.Name;
     }
}

注意我现在在工作，所以请原谅任何错别字或不准确之处。 您可能需要稍微调整一下，但希望这个想法足够清晰。

Answer 2

我留下了另一个答案，因为看看我错在哪里可能会有用。 当我检查时，我意识到<option>标签上的事件不会触发，甚至包括 onclick。

尝试类似以下的操作。 您可能需要添加 using for System.Linq 。

<select name="offices" id="offices" @onchange="SelectOffice">
    <option selected hidden>Select a room</option>
    @foreach (var office in AvailableOffices)
    {
        <option value=@office.ID>@office.Name</option>
    }
</select>

@code{
    Office SelectedOffice {get;set;} // i.e. Account.Office[0]
    List<Office> AvailableOffices {get; set;}

    void SelectOffice(ChangeEventArgs e)
    {
        SelectedOffice = AvailableOffices.Where(ao => ao.ID.ToString() == e.Value.ToString()).First();
    }
}