MatBlazor - Material Design components for Blazor and Razor Components

MatTextField

Material Design Text Field for Blazor. Text fields allow users to input, edit, and select text.

Name Type Description
TValue Generic argument string, sbyte, byte, short, ushort, int, uint, long, ulong, char, float, double, decimal, decimal?, DateTime, DateTime?, bool, bool?
Attributes Dictionary<String,Object> Gets or sets a collection of additional attributes that will be applied to the created element.
Box Boolean
ChildContent RenderFragment Child content of MatTextField
Class String Specifies one or more classnames for an DOM element.
Dense Boolean
Disabled Boolean
Format String
FullWidth Boolean
HelperText String
HelperTextPersistent Boolean
HelperTextValidation Boolean
HideClearButton Boolean
Icon String
IconOnClick EventCallback<MouseEventArgs>
IconTrailing Boolean
Id String
InputAttributes IDictionary<String,Object>
InputClass String Css class of input element
InputStyle String Style attribute of input element
Label String
OnFocus EventCallback<FocusEventArgs>
OnFocusOut EventCallback<FocusEventArgs>
OnInput EventCallback<ChangeEventArgs>
OnKeyDown EventCallback<KeyboardEventArgs>
OnKeyPress EventCallback<KeyboardEventArgs>
OnKeyUp EventCallback<KeyboardEventArgs>
Outlined Boolean
PlaceHolder String
ReadOnly Boolean When true, it specifies that an input field is read-only.
RefBack ForwardRef
Required Boolean
Style String Specifies an inline style for an DOM element.
TextArea Boolean
Type String
ValidationDisabled Boolean
Value TValue Gets or sets the value of the input. This should be used with two-way binding.
ValueChanged EventCallback<TValue> Gets or sets a callback that updates the bound value.
ValueExpression Expression<Func<TValue>> Gets or sets an expression that identifies the bound value.
Ref ElementReference Returned ElementRef reference for DOM element.
Example

MatStringField

It is string only text field component

Helper Text

Helper Text

Helper Text Persistent

Helper Text Validation

Filled With Leading Icon

Filled With Trailing Icon

Outlined

Standard

Dense

Outlined With Leading Icon

Standard

Dense

Outlined With Trailing Icon

Standard

Dense

Textarea

Full Width

Full Width Textarea

PlaceHolder
Required
Disabled and ReadOnly

InputClass and InputStyle

Events
Generic Values

string
Value:

sbyte
Value: 0

sbyte?
Value:

byte
Value: 0

byte?
Value:

short
Value: 0

short?
Value:

ushort
Value: 0

ushort?
Value:

int
Value: 0

int?
Value:

uint
Value: 0

uint?
Value:

long
Value: 0

long?
Value:

ulong
Value: 0

ulong?
Value:

char
Value: �

char?
Value:

float
Value: 0

float?
Value:

double
Value: 0

double?
Value:

decimal
Value: 0

decimal?
Value:

DateTime
Value: 1/1/0001 12:00:00 AM

DateTime?
Value:

bool
Value: False

bool?
Value:

If you like MatBlazor, please put a star on GitHub.