reactjsmaterial-designmaterial-ui

How to disable underline to Material UI's datepicker in React?


How can I disable showing underline to material-ui-pickers?

sandbox https://codesandbox.io/s/l2ykr7kwvz?from-embed

I want to removing underline to its TextField.

I tried

disableUnderline={true}

underlineStyle={{display: 'non'}}

showingUnderline={false}

But nothing works, How can I hide underline?

<DatePicker
    underlineStyle={{display: 'none'}}
    value={selectedDate}
    onChange={this.handleDateChange}
    animateYearScrolling={false}
/>

Solution

  • material-ui date-picker is a text field from the foundation and you can remove the underline simply using input-props

    (DatePicker, TimePicker and DateTimePicker all will work this way)

    <DatePicker
      value={selectedDate}
      InputProps={{
       disableUnderline: true,
      }}
      onChange={this.handleDateChange}
    /> 
    

    find the example from here

    hope this will help you