Filter

Framework Core
Tag Helper <shareit-filter></shareit-filter>

Creates a filter box with fields to use for filtering information on a page.

Filters are made up of FilterFields which are the rendered controls. There are a number of pre-defined filter field controls.

These values are posted back to the form using the respective id of each control.

string id

Id of the filter field

string FilterButtonText
Default: Search

Text to show in the filter button

string ClearButtonText
Default: Reset

Text to show in the clear button

bool RememberFilterValues
Default: true

Place the values in cookies to auto populate on next visit to the page

bool HideFilterButton
Default: false

Hide the filter button

bool HideClearButton
Default: false

Hide the filter button

bool AllowHide
Default: true

Show the hide chevron to allow the filter to collapse

bool StartHidden
Default: false

Start with the filter collapsed

string HiddenText

Will show this text in the filter when collapsed

bool ResetGridPage
Default: true

When filter or clear button is pressed, the ShareItGrid will reset to page 1.

bool AjaxSubmit
Default: false

When true the page will not do a full page post back but rather do an ajax postback of any grids.

bool SingleColumn
Default: false

Render all filter fields vertically in a single column.

RenderModes RenderMode
Default: RenderModes.Horizontal

Render fields either horizontally or vertically.

Tag Helper <base />

This is an abstract class used by all implemented filter field types.

string id

Id of the filter field

string label

Label for the filter field.

string label-class
Default: col-form-label

The css class for the label.

string control-class
Default: form-control

The css class for the control.

string container-class

The css class for the whole field.

bool break-before

Render on a new row.

bool override-value

Force a new value into the field and ignore post backs and cache.

bool override-text

Force a new text into the field and ignore post backs and cache.

string default-value

The value this field will show when reset or first opened and no cookie value exists for it.

object html-attributes

Push any html attributes through to the control.

object label-html-attributes

Push any html attributes through to the label.

Tag Helper <filter-field-autocompleter />

Render an autocompleter field in the filter.

AutoCompleteBase.ResultType result-type

The type of list this autocompleter returns. Posts ResultType. This is a defined enum created in the client application by overloading AutoCompleteBase.ResultType

bool auto-validate

Causes the Javascript validate event to fire on the control after loading to validate any entry in the control.

bool result-type

The type of autocompleter field. See Autocompleter for more information.

int width
Default: -1

The width of the rendered control. If -1 then is left empty for CSS to control.

List<AutoCompleterFilter> filters
Default: null

Posts through the value of a linked field for filtering the list displayed in this control.

List<AutoCompleterExtraParameter> extra-parameters
Default: null

A list of extra Name Value string parameters to be posted along with the control. Allows extra IDs to be sent through.

bool post-invalid
Default: false

Allow the control to post back an entry even if it didn't match a valid item in the list. Useful for allowing additions to the list.

bool show-list
Default: true

Puts an icon next to the AutoCompleter to show a drop down list of all possible entries.

bool text-only
Default: false

The control will not save values but instead always mirror the text. This allow a look up list but still act as a wildcard text field.

bool filter-active
Default: null

Adds "Active" to the Extra Parameters.

Tag Helper <filter-field-checkbox />

Render a checkbox field in the filter.

string label-class
Default: Removes the base css class to leave it empty

The css class for the label.

string control-class
Default: form-check-input

The css class for the control.

Tag Helper <filter-field-date-picker />

Render a date picker field in the filter.

Tag Helper <filter-field-date-time-picker />

Render a date time picker field in the filter.

string select-class
Default: form-select

The css class for the select controls.

Tag Helper <filter-field-partial-date />

Render a partial date field in the filter.

string select-class
Default: form-select

The css class for the select controls.

bool partial-date-show-day

Show the day section of the filter.

bool partial-date-show-month

Show the month section of the filter.

bool partial-date-show-year

Show the year section of the filter.

Tag Helper <filter-field-select />

Render a select field in the filter.

string control-class
Default: form-select

The css class for the select control.

IEnumerable<SelectListItem> items

The select items to render as the options.

Tag Helper <filter-field-textbox />

Render a input text field in the filter.

Filter Control.

Razor
<shareit-filter id="MyFilterId">
<filter-field-date-autocompleter id="filterMyAuto" label="Person" result-type="AutoComplete.ResultType.Person"></filter-field-date-autocompleter>
<filter-field-date-picker id="filterDate" label="Date" default-value="@myDate"></filter-field-date-picker>
<filter-field-select id="filterActive" label="Active" items="@SiUtil.YesNoList()" default-value="Yes"></filter-field-date-select>
</shareit-filter >

Ajax Filter Control.

Razor
<shareit-filter id="MyFilterId">
<filter-field-date-autocompleter id="filterMyAuto" label="Person" result-type="AutoComplete.ResultType.Person"></filter-field-date-autocompleter>
<filter-field-date-picker id="filterDate" label="Date" default-value="@myDate"></filter-field-date-picker>
<filter-field-select id="filterActive" label="Active" items="@SiUtil.YesNoList()" default-value="Yes"></filter-field-date-select>
</shareit-filter >
Javascript
$('#MyFilter_FilterButton').click(function () {
ShareItLibrary.ShareItGrid.Init('MyGrid');
}
$('#MyFilter_ClearButton').click(function () {
$('#filterActive').val('Yes');
ShareItLibrary.ShareItGrid.Init('MyGrid');
}