为什么我不从Blazor页面的EDITFORM中取回绑定值

时间:2020-10-07 21:01:12

标签: blazor-server-side blazor-client-side blazor-webassembly

我的Blazor数据输入有问题。我从EditForm中获得了除一个值以外的所有值。

我有一个称为客户的模型,其中有一个“状态”字段。该字段是一个字符串。但是,我希望用户仅使用复选框来激活客户。我将EDITFORM字段绑定到客户对象字段,但是我需要将INPUTCHECKBOX绑定到本地变量,并使用本地变量的值设置客户的“状态”文本。

这是编辑页面(减去包含):

<CustomerForm ButtonText="Update" isActive="@isActive" 
customer="@customer" OnValidSubmit="@UpdateCustomer"/>

@code {

[Parameter] public int customerId { get; set; }

Customer customer = new Customer();
bool isActive;

protected async override Task OnParametersSetAsync()
{
    customer = await PublicClient.Client.GetFromJsonAsync<Customer>($"api/customers/{customerId}");
    isActive = (customer.Status == "Active") ? true : false;
    //customer = await http.GetFromJsonAsync<Customer>($"api/customers/{customerId}");
}
async Task UpdateCustomer()
{
    // At this point IsActive is always what it is set to in OnParametersSetAsync.                 
    // Even though it is bound in the EDITTFORM
    customer.Status = (isActive) ? "Active" : "Deactivated";
    await PublicClient.Client.PutAsJsonAsync($"api/customers/{customerId}", customer);

    //await http.PutAsJsonAsync($"api/customers/{customerId}", customer);
    await js.InvokeVoidAsync("alert", $"Updated Successfully!");
    uriHelper.NavigateTo("customers");
}
}

请注意,我将单独的值传递给EditForm'isActive'。这可以设置复选框的值。这是EDITFORM代码(在单独的页面中,减去包含):

<EditForm Model="@customer" OnValidSubmit="@OnValidSubmit">
<DataAnnotationsValidator />
<div class="form-group">
    <label>Customer Name :</label>
    <div>
        <InputText @bind-Value="@customer.Name" />
        <ValidationMessage For="@(() => customer.Name)" />
    </div>
</div>
<div class="form-group ">
    <div>
        <label>Customer Number :</label>
        <div>
            <InputText @bind-Value="@customer.CustomerNumber" />
            <ValidationMessage For="@(() => customer.CustomerNumber)" />
        </div>
    </div>
</div>
<div class="form-group ">
    <div>
        <label>Contact :</label>
        <div>
            <InputText @bind-Value="@customer.Contact" />
            <ValidationMessage For="@(() => customer.Contact)" />
        </div>
    </div>
</div>
<div class="form-group ">
    <div>
        <label>Phone :</label>
        <div>
            <InputText @bind-Value="@customer.Phone" />
            <ValidationMessage For="@(() => customer.Phone)" />
        </div>
    </div>
</div>
<div class="form-group ">
    <div>
        <label>Email :</label>
        <div>
            <InputText @bind-Value="@customer.Email" />
            <ValidationMessage For="@(() => customer.Email)" />
        </div>
    </div>
</div>
<div class="form-group ">
    <div>
        <label>Shipping Address :</label>
        <div>
            <InputTextArea @bind-Value="@customer.ShippingAddress" class="col-2" />
            <ValidationMessage For="@(() => customer.ShippingAddress)" />
        </div>
    </div>
</div>
<div class="form-group ">
    <div>
        <div>
            <label>Active :</label>
            <InputCheckbox @bind-Value="@isActive" />
        </div>
    </div>
</div>

<hr />

<button type="submit" class="btn btn-success">
    @ButtonText
</button>

</EditForm>
@code {

[Parameter] public bool isActive { get; set; }
[Parameter] public Customer customer { get; set; }
[Parameter] public string ButtonText { get; set; } = "Save";
[Parameter] public EventCallback OnValidSubmit { get; set; }

}

所有其他绑定字段都会更改。我在做什么错了?

谢谢!

0 个答案:

没有答案