Checkbox - working example -- NumberInput,TextInput - InputAttributes initialization moved to InputBase class
This commit is contained in:
		
							parent
							
								
									d7c2b58f2e
								
							
						
					
					
						commit
						5757d4a6e3
					
				
							
								
								
									
										13
									
								
								src/Connected.Components/Components/CheckBox.razor
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										13
									
								
								src/Connected.Components/Components/CheckBox.razor
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,13 @@
 | 
				
			|||||||
 | 
					@using Connected.Models;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					@inherits InputBase;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<div class="checkbox-group">
 | 
				
			||||||
 | 
					@if (Checked)
 | 
				
			||||||
 | 
					{
 | 
				
			||||||
 | 
					    <input id="@Id" name="checkbox" type="checkbox" @onchange="OnChange" @attributes=@InputAttributes checked> 
 | 
				
			||||||
 | 
					} else {
 | 
				
			||||||
 | 
					    <input id="@Id" name="checkbox" type="checkbox" @onchange="OnChange" @attributes=@InputAttributes>
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					<label for="@Id" class="checkbox-label">@Label</label>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
							
								
								
									
										21
									
								
								src/Connected.Components/Components/CheckBox.razor.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										21
									
								
								src/Connected.Components/Components/CheckBox.razor.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,21 @@
 | 
				
			|||||||
 | 
					using Connected.Models;
 | 
				
			||||||
 | 
					using Microsoft.AspNetCore.Components;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					namespace Connected.Components;
 | 
				
			||||||
 | 
					public partial class CheckBox: InputBase
 | 
				
			||||||
 | 
					{
 | 
				
			||||||
 | 
						[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);
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
							
								
								
									
										9
									
								
								src/Connected.Components/Components/CheckBoxGroup.razor
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								src/Connected.Components/Components/CheckBoxGroup.razor
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,9 @@
 | 
				
			|||||||
 | 
					@using Connected.Models;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					@inherits InputBase;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<div>
 | 
				
			||||||
 | 
					    <div class="container">
 | 
				
			||||||
 | 
					        @ChildContent
 | 
				
			||||||
 | 
					    </div>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
							
								
								
									
										11
									
								
								src/Connected.Components/Components/CheckBoxGroup.razor.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								src/Connected.Components/Components/CheckBoxGroup.razor.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,11 @@
 | 
				
			|||||||
 | 
					using Microsoft.AspNetCore.Components;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					namespace Connected.Components;
 | 
				
			||||||
 | 
					public partial class CheckBoxGroup
 | 
				
			||||||
 | 
					{
 | 
				
			||||||
 | 
						[Parameter, EditorRequired]
 | 
				
			||||||
 | 
						public string Id { get; set; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						[Parameter]
 | 
				
			||||||
 | 
						public RenderFragment ChildContent { get; set; }
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
@ -228,5 +228,14 @@ public partial class NumberInput<NumberType>:InputBase where NumberType : INumbe
 | 
				
			|||||||
		await base.OnParametersSetAsync();
 | 
							await base.OnParametersSetAsync();
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    #endregion
 | 
						protected override async Task OnInitializedAsync()
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
							await base.OnInitializedAsync();
 | 
				
			||||||
 | 
							if (Required)
 | 
				
			||||||
 | 
							{
 | 
				
			||||||
 | 
								if (!InputAttributes.ContainsKey("required")) InputAttributes.Add("required", true);
 | 
				
			||||||
 | 
							}
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						#endregion
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
@ -56,14 +56,13 @@ public partial class TextInput: InputBase
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	protected override async Task OnParametersSetAsync()
 | 
						protected override async Task OnInitializedAsync()
 | 
				
			||||||
    {
 | 
					   {
 | 
				
			||||||
		if (base.InputAttributes is null) base.InputAttributes = new();
 | 
					 | 
				
			||||||
		if (base.Required)
 | 
					 | 
				
			||||||
		{
 | 
					 | 
				
			||||||
			if (base.InputAttributes.ContainsKey("required")) base.InputAttributes.Add("required", true);
 | 
					 | 
				
			||||||
		}
 | 
					 | 
				
			||||||
		await base.OnInitializedAsync();
 | 
							await base.OnInitializedAsync();
 | 
				
			||||||
    }
 | 
							if (Required)
 | 
				
			||||||
 | 
							{
 | 
				
			||||||
 | 
								if (!InputAttributes.ContainsKey("required")) InputAttributes.Add("required", true);
 | 
				
			||||||
 | 
							}
 | 
				
			||||||
 | 
					   }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
@ -1,7 +1,5 @@
 | 
				
			|||||||
using Connected.Utilities;
 | 
					using Connected.Utilities;
 | 
				
			||||||
using Microsoft.AspNetCore.Components;
 | 
					using Microsoft.AspNetCore.Components;
 | 
				
			||||||
using static Connected.Colors;
 | 
					 | 
				
			||||||
using static System.Net.Mime.MediaTypeNames;
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
namespace Connected.Models;
 | 
					namespace Connected.Models;
 | 
				
			||||||
public class InputBase : ComponentBase
 | 
					public class InputBase : ComponentBase
 | 
				
			||||||
@ -124,4 +122,9 @@ public class InputBase : ComponentBase
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
	[Parameter]
 | 
						[Parameter]
 | 
				
			||||||
	public string Placeholder { get; set; } = string.Empty;
 | 
						public string Placeholder { get; set; } = string.Empty;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						protected override async Task OnInitializedAsync()
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
							if (InputAttributes is null) InputAttributes = new();
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user