Topic: adding clickable calendar icon in date picker.
I want to add a calendar icon in react date picker. When user will click on icon, the calendar will pop out. Also, I want to display today's date button on the calendar.
Hello @viswanathm and @musme,
Are you interested in something like this?
My code
import React from "react";
import { MDBDatePicker } from "mdbreact";
function DatePicker(props) {
return (
<MDBDatePicker
keyboard
value={new Date()}
/>
);
}
export default DatePicker;
Your regards, Konrad.
musme commented 5 years ago
Thanks, @Konrad Stępień What about "show password" icon in Material Text Input?
Konrad Stępień staff commented 5 years ago
Answer above. We can create such an option available for MDBInput, but currently, there is no way to show such a button via MDBInput. It is possible to add your own element with the condition to the aforementioned component, with the appropriate states. For example
import React from "react";
import { MDBInput } from "mdbreact";
class Inp extends React.Component {
state = {
type: "password"
};
showPassword = () => {
this.setState({ type: "text" });
};
hidePassword = () => {
this.setState({ type: "password" });
};
render() {
return (
<MDBInput type={this.state.type}>
<span onMouseEnter={this.showPassword} onMouseLeave={this.hidePassword}>
Show passowrd
</span>
</MDBInput>
);
}
}
export default Inp;
@Konrad Stępień, I want to use something like this:
<MDBInput label="Username" icon="user" IconOnClick={this.props.togglePassword}/>
IconOnClick={any passed function}
Konrad Stępień staff commented 5 years ago
Here you can go to API and check all props for MDBInput, for now, it is not possible to set an event for the icon, but you can use MDBInput without icon and MDBIcon with function for onClick. We also can add these props for feature if you want.
musme commented 5 years ago
Yes, please! Thanks!
Konrad Stępień staff commented 5 years ago
Ok, thanks to you for suggestions. We will deal with this in the near future. Best, Konrad
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB React
- MDB Version: 4.16.0
- Device: laptop
- Browser: chrome
- OS: windows
- Provided sample code: No
- Provided link: No
musme commented 5 years ago
Yes, I want too! Also, I want to add a clickable "show password" icon in Material Text Input.
Konrad Stępień staff commented 5 years ago
@musme
Do you mean to add an option to
MDBInputto display theshow passwordbutton near the Input element? If you want this option, we can add it in the future.Best, Konrad.