# EuiMaxLengthDirective

**Type:** directive



A directive that adds maxLength functionality to input and textarea elements with visual feedback.
It shows the remaining characters count and provides visual indication when the limit is reached.


```html
### Basic usage
```html
<input [euiMaxlength]="50">
```
### With form control
```html
<input [formControlName]="'name'" [euiMaxlength]="100">
```

### Hide maxlength indicator
```html
<textarea [euiMaxlength]="200" [isShowMaxlength]="false"></textarea>
```



**Selector:** `
    input[euiMaxlength],
    textarea[euiMaxlength],
    [ngModel][euiMaxlength],
    [formControlName][euiMaxlength]`

## Inputs
- **euiMaxlength**: `number` - It accepts number values to indicate the maxLength of an input. To reset or disable it set the value to null. NULL value will remove any MaxLength indicator even if another input like isShowMaxlength equals true.
- **isShowMaxlength**: `boolean` - Controls the visibility of the maxLength indicator. When true, shows a counter with remaining characters. When false, hides the counter but maintains the maxLength restriction.

## Outputs
- **maxLengthReached**: `EventEmitter<boolean>` - Emits when the input value length reaches or exceeds the maxLength limit. Emits true when a limit is reached, false when below limit.