MDBInput - How to add a clear Icon on the right?

Topic: MDBInput - How to add a clear Icon on the right?

Expected behavior Add a clear icon at the right side of the MDBInput Component which can be used to clear the content of the input field.

Actual behavior No sample code could be found Resources (screenshots, code snippets etc.)

Piotr Glejzer staff commented 4 years ago

Thanks for suggestion we will try to add an example with that.

Add comment

Krzysztof Wilk staff answered 2 years ago

1 0 Best answer

Hi!

You can add a clear icon to the input using i.e. code below:

        <MDBInput
          value={inputValue}
          onChange={(e: React.ChangeEvent<HTMLInputElement>) => setInputValue(e.target.value)}
        >
          <span tabIndex={0} className='select-clear-btn d-block' role='button' onClick={() => setInputValue('')}>
            ✕
          </span>
        </MDBInput>

Keep coding!

Add comment

Rossi20022022 pro premium priority answered 2 years ago