Skip to content
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.

Sign up for GitHub

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

Input Autocomplete attribute #349

Merged
merged 6 commits into from
Jun 17, 2022
Merged

Input Autocomplete attribute #349

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
fe4ee24
Add AutoComplete enum and extension
toonech Jun 12, 2022
891a565
Wire up Autocomplete
toonech Jun 12, 2022
d2fddf2
Add autocomplete to Grid Create and Update components
toonech Jun 12, 2022
de6b176
Test autocomplete attribute
toonech Jun 12, 2022
ef23d53
Making casing consistent
toonech Jun 12, 2022
e240cfb
Rename InputAutocomplete.cs to InputAutoComplete.cs
toonech Jun 12, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions GridBlazor/Columns/DefaultColumnBuilder.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -113,6 +113,12 @@ private void ApplyColumnAnnotationSettings(IGridColumn<T> column, GridColumnAttr
if (initialDirection.HasValue)
column.SortInitialDirection(initialDirection.Value);

AutoCompleteTerm? autoCompleteTaxonomy = options.GetAutocompleteTaxonomy();
if (autoCompleteTaxonomy.HasValue)
{
column.SetAutoCompleteTaxonomy(autoCompleteTaxonomy.Value);
}

if (!string.IsNullOrEmpty(options.FilterWidgetType))
column.SetFilterWidgetType(options.FilterWidgetType);

Expand Down
24 changes: 24 additions & 0 deletions GridBlazor/Columns/GridColumnBase.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,6 +133,10 @@ public abstract class GridColumnBase<T> : GridStyledColumn, IGridColumn<T>, IExp

public string TooltipValue { get; set; }

public AutoCompleteTerm AutoCompleteTaxonomy { get; set; }

public Func<string> CustomAutoComplete { get; set; } = () => null;

public IGridColumn<T> Titled(string title)
{
Title = title;
Expand Down Expand Up @@ -526,6 +530,26 @@ public IGridColumn<T> SetCrudHidden(bool create, bool read, bool update, bool de
return this;
}

/// <inheritdoc/>
public IGridColumn<T> SetAutoCompleteTaxonomy(AutoCompleteTerm taxonomy)
{
AutoCompleteTaxonomy = taxonomy;
if (taxonomy == AutoCompleteTerm.Custom)
{
throw new ArgumentException("Must supply custom argument when using custom autocomplete");
}
CustomAutoComplete = this.ToAutocompleteFunc();
return this;
}

/// <inheritdoc/>
public IGridColumn<T> SetAutoCompleteTaxonomy(Func<string> custom)
{
AutoCompleteTaxonomy = AutoCompleteTerm.Custom;
CustomAutoComplete = custom;
return this;
}

public IGridColumn<T> SetAfterChangeValue(Func<T, GridMode, Task> afterChangeValue)
{
AfterChangeValue = afterChangeValue;
Expand Down
30 changes: 15 additions & 15 deletions GridBlazor/Pages/GridCreateComponent.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@
else
{
var selectedValue = column.GetFormatedValue(value);
<select id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@selectedValue" @onchange="(e) => ChangeValue(e, column)">
<select autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@selectedValue" @onchange="(e) => ChangeValue(e, column)">
<option value="">@Strings.SelectItem</option>
@foreach (var selectItem in ((IGridColumn<T>)column).SelectItems)
{
Expand Down Expand Up @@ -84,7 +84,7 @@
else
{
var selectedValue = column.GetFormatedValue(value);
<select id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@selectedValue" @onchange="(e) => ChangeValue(e, column)">
<select autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@selectedValue" @onchange="(e) => ChangeValue(e, column)">
<option value="">@Strings.SelectItem</option>
@{
var selectItems = SelectItems.Get(column.Name);
Expand Down Expand Up @@ -188,7 +188,7 @@
InputFiles.Add(column.FieldName, reference);
}
<div class="input-group">
<input type="text" id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@column.GetFormatedValue(value)">
<input autocomplete="@column.CustomAutoComplete.Invoke()" type="text" id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@column.GetFormatedValue(value)">
<span class="input-group-btn">
<button type="button" class="btn btn-default btn-primary grid-button-input-file" @onclick="() => ButtonFileClicked(column.FieldName)">@Strings.Files</button>
</span>
Expand All @@ -209,44 +209,44 @@
{
if (GridComponent.IsWeekSupported)
{
<input id="@column.FieldName" name="@column.FieldName" type="@typeAttr" placeholder="yyyy-Www" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="@typeAttr" placeholder="yyyy-Www" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
}
else
{
<input id="@column.FieldName" name="@column.FieldName" type="text" placeholder="yyyy-Www" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="text" placeholder="yyyy-Www" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
}
}
else if (typeAttr == "month")
{
if (GridComponent.IsMonthSupported)
{
<input id="@column.FieldName" name="@column.FieldName" type="@typeAttr" placeholder="yyyy-mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="@typeAttr" placeholder="yyyy-mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
}
else
{
<input id="@column.FieldName" name="@column.FieldName" type="text" placeholder="yyyy-mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="text" placeholder="yyyy-mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
}
}
else if (typeAttr == "datetime-local")
{
if (GridComponent.IsDateTimeLocalSupported)
{
<input id="@column.FieldName" name="@column.FieldName" type="@typeAttr" placeholder="yyyy-mm-dd hh:mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="@typeAttr" placeholder="yyyy-mm-dd hh:mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
}
else
{
<input id="@column.FieldName" name="@column.FieldName" type="text" placeholder="yyyy-mm-dd hh:mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="text" placeholder="yyyy-mm-dd hh:mm" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
}
}
else
{
<input id="@column.FieldName" name="@column.FieldName" type="@typeAttr" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="@typeAttr" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column, typeAttr)" />
}
}
else if (type == typeof(System.TimeSpan))
{
string typeAttr = ((IGridColumn<T>)column).InputType == InputType.None ? "time" : ((IGridColumn<T>)column).InputType.ToTypeAttr();
<input id="@column.FieldName" name="@column.FieldName" type="@typeAttr" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="@typeAttr" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@(((ICGridColumn)column).GetFormatedDateTime(value, typeAttr))" @onchange="(e) => ChangeValue(e, column)" />
}
else if (type == typeof(bool))
{
Expand All @@ -256,14 +256,14 @@
{
<label class="col-form-label">@column.FalseLabel</label>
<label class="grid-switch">
<input id="@column.FieldName" name="@column.FieldName" type="checkbox" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" checked="checked" value="true" @onchange="(e) => ChangeValue(e, column)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="checkbox" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" checked="checked" value="true" @onchange="(e) => ChangeValue(e, column)" />
<span class="grid-slider round"></span>
</label>
<label class="col-form-label">@column.TrueLabel</label>
}
else
{
<input id="@column.FieldName" name="@column.FieldName" type="checkbox" class="form-check @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" checked="checked" value="true" @onchange="(e) => ChangeValue(e, column)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" type="checkbox" class="form-check @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" checked="checked" value="true" @onchange="(e) => ChangeValue(e, column)" />
}
}
else
Expand All @@ -285,11 +285,11 @@
}
else if (((IGridColumn<T>)column).InputType == InputType.Number)
{
<input type="@(InputType.Number.ToTypeAttr())" id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@column.GetFormatedValue(value)" @onchange="(e) => ChangeValue(e, column)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" type="@(InputType.Number.ToTypeAttr())" id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@column.GetFormatedValue(value)" @onchange="(e) => ChangeValue(e, column)" />
}
else
{
<input id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@column.GetFormatedValue(value)" @onchange="(e) => ChangeValue(e, column)" />
<input autocomplete="@column.CustomAutoComplete.Invoke()" id="@column.FieldName" name="@column.FieldName" class="form-control @(ColumnErrors.ContainsKey(@column.FieldName) ? "input-validation-error" : "")" value="@column.GetFormatedValue(value)" @onchange="(e) => ChangeValue(e, column)" />
}
<span class="field-validation-error">
<span>@ColumnErrors.Get(column.FieldName)</span>
Expand Down
Loading