为Blazor的Telerik UI?下载30天免费试用

不确定的状态

除了检查而且无节制的基本状态,Telerik复选框有第三个状态-不确定的.这意味着它的状态介于两者之间——既没有检查,也没有未检查。主要的用例是当复选框拥有许多子选项并且它们具有不同的状态时,而主复选框处于不确定状态。

若要将复选框置于不确定状态,请设置其不确定的参数真正的.你可以把它绑定到保龄球而且bool吗?类型,它还会暴露IndeterminateChanged事件以及双向结合。

不确定的参数映射到不确定的属性的标准HTML

应用程序逻辑应该设置Indeterminate状态以向用户显示信息。用户与组件的交互将清除该状态并设置真正的它的价值和不确定的参数将设置为..

例如,如果您将复选框绑定到一个可为空的字段,那么它的值为,您可能希望将复选框显示为不确定。

基本设置-在未定义值时显示不确定复选框(null)

这个例子展示了当一个复选框的值未知(例如,null)时,如何使它成为不确定的。它还展示了当用户改变复选框的状态时,不确定状态被设置为false。HasValue) 
Checked: @TheValue
Make indeterminate
Checkbox @code{bool?TheValue {get;设置;} //默认为空,所以复选框最初是不确定的}

观察Indeterminate状态的行为

@*观察Select all复选框的行为*@ 

交付

@foreach (var delivery in delivered) {
} @if (AlreadyDelivered. any ()) {
Successfully delivered products:
    @{foreach (AlreadyDelivered中的var item) {
  • @item。ProductName
  • }}
} @code {public bool选择bool {get{返回交付。所有(item => item. isdelivered);}}公共bool选择不确定{获取{返回交付。Any(item => item. isdelivered) && !}}公共列表<交付>交付{get;设置;}公共列表<交付>已经交付{get{返回交付。Where(x => x. isdelivered == true).ToList();}} void ChangeAllHander(bool newVal){交付。ForEach(item =>项目。IsDelivered = newVal); } void ChangeHandler(bool value, string productName) { var item = Deliveries.Where(x => x.ProductName == productName).First(); item.IsDelivered = value; } //In real case scenarios the model will be in a separate file. public class Delivery { public string ProductName { get; set; } public bool IsDelivered { get; set; } } //Generating dummy data protected override void OnInitialized() { //Make your real data generation here. Deliveries = new List(); Deliveries.Add(new Delivery() { ProductName = "PC", IsDelivered = false }); Deliveries.Add(new Delivery() { ProductName = "Mobile Phone", IsDelivered = false }); Deliveries.Add(new Delivery() { ProductName = "Headset", IsDelivered = false }); Deliveries.Add(new Delivery() { ProductName = "Monitor", IsDelivered = false }); } }

上面代码片段的结果

gif来展示不确定状态

另请参阅

在本文中
Baidu
map