I am getting a console error (not a crash) when I have a checkbox like this:
<TelerikCheckBox Enabled="@(!CheckBoxValueProperty)"
@bind-Value="@CheckBoxValueProperty">
</TelerikCheckBox>
The console error is:
blazor.webassembly.js:1 Uncaught (in promise) Error: Assertion failed - heap is currently locked
at tt (blazor.webassembly.js:1:45154)
at Object.beginInvokeDotNetFromJS (blazor.webassembly.js:1:42007)
at b (blazor.webassembly.js:1:1995)
at N.invokeMethodAsync (blazor.webassembly.js:1:3845)
at $W.invokeMethodAsync (telerik-blazor.js:50:1037174)
at HTMLInputElement.<anonymous> (telerik-blazor.js:50:2198768)
at se.applyAttribute (blazor.webassembly.js:1:24602)
at se.applyEdits (blazor.webassembly.js:1:21459)
at se.updateComponent (blazor.webassembly.js:1:20461)
at blazor.webassembly.js:1:57076
The checkbox works properly and disables itself when it is checked with a precondition of CheckBoxValueProperty = false.
It would be good though, if this simple method of having the checkbox disable itself with the same property value, would not throw the console error.
We have encountered the following accessibility issue with the Checkbox:
Snippet:
<input type="checkbox" data-id="e218e1d5-71c6-4327-8d3c-88b0c62397a1" class="k-checkbox telerik-blazor" aria-checked="false">
How to fix - Fix ONE the following:
When I click the checkbox, the OnChange event fires with the new value, but the model field is not updated yet.
<TelerikCheckBox Id="myCheckBox"
@bind-Value="@isSelected"
OnChange="@ChangeHandler">
</TelerikCheckBox>
<label for="myCheckBox">@(isSelected ? "Selected" : "Not selected")</label>
<div class="text-info">
@Result
</div>
@code {
private bool isSelected { get; set; }
private string Result { get; set; } = String.Empty;
void ChangeHandler(object value)
{
Console.WriteLine($"CHECKBOX: the model is now {isSelected} and the handler received {value}");
Result = $"OnChange event fired with: {value}";
}
}