HelpBot Assistant

How can I help you?

Maximum Length in React TextArea Component

21 Feb 20262 minutes to read

Enforce a maximum length limit using the maxLength property, which defines the maximum number of characters users can input. By setting this property, you control text length and prevent users from exceeding the specified limit.

// Import the TextArea.
import { TextAreaComponent } from '@syncfusion/ej2-react-inputs';
import * as React from 'react';
import * as ReactDom from 'react-dom';

// To render TextArea.
function App() {
    return (
        <div className='wrap'>
            <TextAreaComponent id="default" placeholder="Enter your comments" maxLength="20"></TextAreaComponent>
        </div>
    );
}
export default App;
ReactDom.render(<App />, document.getElementById('input-container'));
// Import the TextArea.
import { TextAreaComponent } from '@syncfusion/ej2-react-inputs';
import * as React from 'react';
import * as ReactDom from 'react-dom';

// To render TextArea.
function App() {
  
    return (
        <div className='wrap'>
            <TextAreaComponent id="default" placeholder="Enter your comments" maxLength="20"></TextAreaComponent>
        </div>
    );
}
export default App;
ReactDom.render(<App />,document.getElementById('input-container'));

When the user reaches the specified limit, the TextArea prevents further input, ensuring compliance with the defined character limit. This feature helps maintain data integrity and provides users with clear feedback on the allowed input length.