Question: I am using react datepicker and I have a calendar icon that when you click it popups the calendar. I implemented where the calendar closes

I am using react datepicker and I have a calendar icon that when you click it popups the calendar. I implemented where the calendar closes when I click anywhere outside the calendar, but I want to close the calendar popup when I click the calendar icon as well. right now it goes in an out when i click the icon again.

here is relvant code:

const handleDateChange = (e, newDate) => {

e.preventDefault();

const date = new Date(dateformat(newDate,"isoDate", true)+'T00:00:00.000');

setCalendarDate(date);

history.push(`/${page}/${sport}/${newDate}`);

};

const handleClick = (e) => {

e.preventDefault();

setIsOpen(!isOpen)

};

const handleOutsideClick =(e)=>{

if(isOpen && !e.target.closest(".react-datepicker")){

setIsOpen(false)

}

}

DropdownToggle tag="div" className="date-choose pad-left-0 pad-right-0">

Step by Step Solution

There are 3 Steps involved in it

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!