如何使用Blazor和DevExpress在切换CheckBox后显示弹出窗口

Question

更改状态的DxCheckBox时，我需要显示一个确认弹出窗口。原始版本如下：

<DxCheckBox @bind-Checked="@value" CheckType="CheckType.Switch" Enabled="false" />

当开关为假并且用户点击开关时；你想让产品活跃起来吗&"；，并且当开关br为真并且用户点击开关时；是否要使产品处于非活动状态">

我尝试添加onclick事件，但不起作用。我尝试的其他解决方案如下：

<DxCheckBox CheckType="CheckType.Switch" Enabled="false" CheckedChanged="@((bool value) => ShowChangeAvailabilityConfirm(value))" />

但也不起作用。

尝试遵循此链接中的文档https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxCheckBox-1.CheckedChanged这个链接https://docs.devexpress.com/Blazor/DevExpress.Blazor.DxCheckBox-1._properties

有人已经通过了类似的考试，有什么建议吗？

我尝试使用以下代码应用建议：

<DisplayTemplate>
@{
var item = context as PriceListValueDTO;
var value = item.IsUnavailableForSale;
<DxCheckBox Checked="@value" CheckType="CheckType.Switch" Enabled="true" T="bool" CheckedChanged="ShowChangeAvailabilityConfirm" />
}
</DisplayTemplate>

在文件razor.cs中，我尝试了

private async Task ShowChangeAvailabilityConfirm(bool value)
{
if (value)
{
await this.ConfirmPopupRef.Open(ConfirmOptionEnum.ToUnavailable)
.ContinueWith((o) => value = false);
}

await this.ConfirmPopupRef.Open(ConfirmOptionEnum.ToAvailable)
.ContinueWith((o) => value = true);
}

它成功了！

Answer 1

您还需要设置Checked参数，并在CheckedChanged事件发生时手动更新：

<DxCheckBox CheckType="CheckType.Switch"
Checked="@_isChecked"
CheckedChanged="ShowChangeAvailabilityConfirm" />
@code {
private bool _isChecked;
private void ShowChangeAvailabilityConfirm(bool value)
{
// show confirm dialog and set _isChecked if result is confirmed
if (dialogResult.IsConfirmed)
{
_isChecked = value;
}
}
}

您可以简化

CheckedChanged="@((bool value) => ShowChangeAvailabilityConfirm(value))"

至

CheckedChanged="ShowChangeAvailabilityConfirm"