-
Notifications
You must be signed in to change notification settings - Fork 9.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add some way to specify indeterminate checkboxes in blazor #10378
Comments
We've moved this issue to the Backlog milestone. This means that it is not going to happen for the coming release. We will reassess the backlog following the current release and consider this item at that time. However, keep in mind that there are many other high priority features with which it will be competing for resources. |
Hello, just a up to know what the the current state of this issue. Is something plan for example for the .net core 3.1 ? thanks ! |
@julienGrd this is not something we plan to handle for 3.1. |
It would be best to submit either a design proposal (ie a description of how this would be implemented) or a PR with a rough version of that implementation. Then we could determine whether this fits well enough to bake into the core. |
I implemented this simple component in .NET core 3.1+. The css is from bootstrap, needed to display an empty box, a checked one and a box "full" to indicate the states 0,1,-1 (can change these values easily): <style>
[class^="icon-"], [class*=" icon-"] { display: inline-block; width: 14px; height: 14px; margin-top: 1px; *margin-right: .3em; line-height: 14px; vertical-align: text-top; background-image: url(/img/glyphicons-halflings.png); background-position: 14px 14px; background-repeat: no-repeat; }
.bootstrap-checkbox { display: inline-block; position: relative; width: 13px; height: 13px; border: 1px solid #000; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.bootstrap-checkbox i { position: absolute; left: -2px; top: -3px; }
.icon-stop { background-position: -312px -72px; }
/* -24px *1 -18px *4 */
.icon-check { background-position: -288px 0px; }
</style> and this is the blazor component: <div @ref=checkboxElement class="bootstrap-checkbox" @onclick="(e) => OnClick(e)"><i class="@ImgClass"></i></div>@Description
@code {
public ElementReference checkboxElement { get; set; }
[Parameter]
public string Description { get; set; }
[Parameter]
public bool? Checked { get; set; }
public string ImgClass { get; set; }
public int Value { get; set; }
protected override void OnInitialized()
{
Value = Checked switch { null => -1, true => 1, false => 0 };
ImgClass = Value switch { -1 => "icon-stop", 1 => "icon-check", _ => "" };
}
public void OnClick(MouseEventArgs e)
{
switch (ImgClass)
{
case "":
ImgClass = "icon-check";
Value = 1;
break;
case "icon-check":
ImgClass = "icon-stop";
Value = -1;
break;
case "icon-stop":
ImgClass = "";
Value = 0;
break;
}
}
} |
Thanks for contacting us. We're closing this issue as there was no community involvement here for quite a while now. You can learn more about our triage process and how we handle issues by reading our Triage Process writeup. |
Add some way to specify indeterminate checkboxes in blazor
Need this output (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#Indeterminate_state_checkboxes)
The text was updated successfully, but these errors were encountered: