How Can I add the placeholder (Not Label) to MUI 5 DatePicker?-CodePudding

I want to add the placholder to MUI 5 date picker, here is the MUI 5 datepickerlink: https://mui.com/x/react-date-pickers/date-picker/

The thing I want to achieve is: https://www.awesomescreenshot.com/image/31706755?key=096a75ccfcf711b0806280400c10727f

You can refer me to this chat, but it is not working in my case: How to set the placeholder text of the MUI DatePicker?

I also don't want to add label as the user click in the filed the lable pushed to the border.

So, my requirement is add the placholder text like we can add in the textfiled. I hope now it is clear now.

CodePudding user response：

You can add placeholder on input props like this :

  <DatePicker
        value={value}
        onChange={(newValue) => {
          setValue(newValue);
        }}
        inputProps={{
          placeholder: "Placeholder"
        }}
        renderInput={(params) => <TextField {...params} />}
      />

Happy coding.