Material-ui: InputProps do not get applied to input

Created on 12 Dec 2017 · 4Comments · Source: mui-org/material-ui

Expected Behavior

InputProps do get applied to input

Current Behavior

InputProps do get applied to surrounding div
-> maxLength cannot be used as it has no effect

Steps to Reproduce

https://codesandbox.io/s/q9x7ywk8pq

question

Source

edesr1988

👍2

Most helpful comment

@edesr1988 We used to have an inputProps property but it was removed to reduce the API surface. Here is who you would do it:

    <TextField
      placeholder="Test"
      label="Test"
      InputProps={{ inputProps: { maxLength: 5 } }}
    />

Basically, you have to know the TextField structure:

TextField > Input > input

oliviertassinari on 12 Dec 2017

😕7 👍4

All 4 comments

@edesr1988 We used to have an inputProps property but it was removed to reduce the API surface. Here is who you would do it:

    <TextField
      placeholder="Test"
      label="Test"
      InputProps={{ inputProps: { maxLength: 5 } }}
    />

Basically, you have to know the TextField structure:

TextField > Input > input

oliviertassinari on 12 Dec 2017

😕7 👍4

Next time, please submit support requests and questions to StackOverflow using the tag material-ui. StackOverflow is better suited for this kind of support. The issue tracker is for bug reports and feature discussions. See also our CONTRIBUTING guidelines.

oliviertassinari on 12 Dec 2017

Then what is the use of inputProps here?

v4.0.1 TextField - API Docs

EDIT: Both work, actually, I just cannot get pattern to work: e.g. pattern: "[0-9]*"
RE-EDIT: Actually, pattern does work, it's just its behaviour is not what I expected. I'll crawl back under my rock now...