Label component for field level help

This commit is contained in:
Shaun Walker
2020-03-16 15:06:59 -04:00
parent dc2c46e878
commit 8bc694fe63
8 changed files with 196 additions and 11 deletions

View File

@ -6,26 +6,26 @@
<table class="table table-borderless">
<tr>
<td>
<label class="control-label">Name: </label>
<Label For="_name" Class="control-label" HelpText="Name Of The Role">Name: </Label>
</td>
<td>
<input class="form-control" @bind="@_name" />
<input id="_name" class="form-control" @bind="@_name" />
</td>
</tr>
<tr>
<td>
<label class="control-label">Description: </label>
<Label For="_description" Class="control-label" HelpText="A Short Description Of The Role Which Describes Its Purpose">Description: </Label>
</td>
<td>
<textarea class="form-control" @bind="@_description" rows="5"></textarea>
<textarea id="_description" class="form-control" @bind="@_description" rows="5"></textarea>
</td>
</tr>
<tr>
<td>
<label class="control-label">Auto Assigned? </label>
<Label For="_isautoassigned" Class="control-label" HelpText="Indicates Whether Or Not New Users Are Automatically Assigned To This Role">Auto Assigned? </Label>
</td>
<td>
<select class="form-control" @bind="@_isautoassigned">
<select id="_isautoassigned" class="form-control" @bind="@_isautoassigned">
<option value="True">Yes</option>
<option value="False">No</option>
</select>
@ -33,10 +33,10 @@
</tr>
<tr>
<td>
<label class="control-label">System Role? </label>
<Label For="_issystem" Class="control-label" HelpText="Indicates Whether Or Not This Is A System Role. System Roles Are Protected And Cannot Be Deleted.">System Role? </Label>
</td>
<td>
<select class="form-control" @bind="@_issystem">
<select id="_issystem" class="form-control" @bind="@_issystem">
<option value="True">Yes</option>
<option value="False">No</option>
</select>

View File

@ -0,0 +1,42 @@
@namespace Oqtane.Modules.Controls
@inherits ModuleBase
@if (!string.IsNullOrEmpty(HelpText))
{
<span class="app-tooltip" data-tip="@((MarkupString)HelpText)">@((MarkupString)_openLabel)@ChildContent@((MarkupString)_closeLabel) <img src="images/help.png" /></span>
}
else
{
@((MarkupString)_openLabel)@ChildContent@((MarkupString)_closeLabel)
}
@code {
string _openLabel = "";
string _closeLabel = "</label>";
[Parameter]
public RenderFragment ChildContent { get; set; } // required - the title of the label
[Parameter]
public string For { get; set; } // optional - the id of the associated input control for accessibility
[Parameter]
public string Class { get; set; } // optional - the class for the label ( ie. control-label )
[Parameter]
public string HelpText { get; set; } // optional - tooltip for this label
protected override void OnParametersSet()
{
_openLabel = "<label";
if (!string.IsNullOrEmpty(For))
{
_openLabel += " for=\"" + For + "\"";
}
if (!string.IsNullOrEmpty(Class))
{
_openLabel += " class=\"" + Class + "\"";
}
_openLabel += ">";
}
}