Radio, RadioGroup
This commit is contained in:
parent
a90cf518a3
commit
d688b25589
@ -6,14 +6,21 @@
|
|||||||
|
|
||||||
<p>SelectedValue: @SelectedValue.ToString()</p>
|
<p>SelectedValue: @SelectedValue.ToString()</p>
|
||||||
|
|
||||||
<CheckBoxGroup Id="chkgroup1">
|
<RadioGroup Name="Group1">
|
||||||
<CheckBox Id="checkbox1" Label="Chk 1" />
|
<Radio Id="radio1" Label="Group 1, Radio 1"></Radio>
|
||||||
<CheckBox Id="checkbox2" Label="Chk 2" />
|
<Radio Id="radio2" Label="Group 1, Radio 2"></Radio>
|
||||||
<CheckBox Id="checkbox3" Label="Chk 3" />
|
<Radio Id="radio3" Label="Group 1, Radio 3"></Radio>
|
||||||
<CheckBox Id="checkbox4" Label="Chk 4" />
|
<Radio Id="radio4" Label="Group 1, Radio 4"></Radio>
|
||||||
<CheckBox Id="checkbox5" Label="Chk 5" />
|
<Radio Id="radio5" Label="Group 1, Radio 5" Disabled=true></Radio>
|
||||||
</CheckBoxGroup>
|
</RadioGroup>
|
||||||
|
|
||||||
|
<RadioGroup Name="Group2" Disabled=true>
|
||||||
|
<Radio Id="radio21" Label="Group 2, Radio 1"></Radio>
|
||||||
|
<Radio Id="radio22" Label="Group 2, Radio 2"></Radio>
|
||||||
|
<Radio Id="radio23" Label="Group 2, Radio 3"></Radio>
|
||||||
|
<Radio Id="radio24" Label="Group 2, Radio 4"></Radio>
|
||||||
|
<Radio Id="radio25" Label="Group 2, Radio 5"></Radio>
|
||||||
|
</RadioGroup>
|
||||||
@code {
|
@code {
|
||||||
|
|
||||||
int SelectedValue;
|
int SelectedValue;
|
||||||
|
8
src/Connected.Components/Components/Radio.razor
Normal file
8
src/Connected.Components/Components/Radio.razor
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
@using Connected.Models;
|
||||||
|
|
||||||
|
@inherits InputBase;
|
||||||
|
|
||||||
|
<div class="radio-group">
|
||||||
|
<input id="@Id" name="@ParentRadioGroup.Name" type="radio" @onchange="OnChange" @attributes=@InputAttributes>
|
||||||
|
<label for="@Id" class="radio-label">@Label</label>
|
||||||
|
</div>
|
31
src/Connected.Components/Components/Radio.razor.cs
Normal file
31
src/Connected.Components/Components/Radio.razor.cs
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
using Connected.Models;
|
||||||
|
using Microsoft.AspNetCore.Components;
|
||||||
|
|
||||||
|
namespace Connected.Components;
|
||||||
|
public partial class Radio: InputBase
|
||||||
|
{
|
||||||
|
[CascadingParameter]
|
||||||
|
public RadioGroup? ParentRadioGroup { get; set; }
|
||||||
|
|
||||||
|
[Parameter]
|
||||||
|
public bool Checked { get; set; } = false;
|
||||||
|
|
||||||
|
[Parameter, EditorRequired]
|
||||||
|
public string Id { get; set; }
|
||||||
|
|
||||||
|
[Parameter]
|
||||||
|
public EventCallback<bool> CheckedChange { get; set; }
|
||||||
|
public async Task OnChange(ChangeEventArgs args)
|
||||||
|
{
|
||||||
|
Checked = (bool)args.Value;
|
||||||
|
CheckedChange.InvokeAsync(Checked);
|
||||||
|
}
|
||||||
|
|
||||||
|
protected override async Task OnInitializedAsync()
|
||||||
|
{
|
||||||
|
await base.OnInitializedAsync();
|
||||||
|
if (ParentRadioGroup.Disabled) Disabled = true;
|
||||||
|
if (!InputAttributes.ContainsKey("disabled"))
|
||||||
|
InputAttributes.Add("disabled", Disabled);
|
||||||
|
}
|
||||||
|
}
|
15
src/Connected.Components/Components/RadioGroup.razor
Normal file
15
src/Connected.Components/Components/RadioGroup.razor
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
@using Connected.Models;
|
||||||
|
|
||||||
|
@inherits InputBase;
|
||||||
|
|
||||||
|
<CascadingValue Value="this">
|
||||||
|
<div>
|
||||||
|
@if (!string.IsNullOrEmpty(Name))
|
||||||
|
{
|
||||||
|
<h5>@Name</h5>
|
||||||
|
}
|
||||||
|
<div class="container">
|
||||||
|
@ChildContent
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CascadingValue>
|
12
src/Connected.Components/Components/RadioGroup.razor.cs
Normal file
12
src/Connected.Components/Components/RadioGroup.razor.cs
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
using Microsoft.AspNetCore.Components;
|
||||||
|
|
||||||
|
namespace Connected.Components;
|
||||||
|
public partial class RadioGroup
|
||||||
|
{
|
||||||
|
[Parameter, EditorRequired]
|
||||||
|
public string Name { get; set; }
|
||||||
|
|
||||||
|
[Parameter]
|
||||||
|
public RenderFragment ChildContent { get; set; }
|
||||||
|
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user