Question 229149 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Popover component with calendar modal in React closes when selecting a date

I am a junior front-end developer and wanted to make my own admin panel as part of my training.

I wanted to make a popover component that has a menu in it. When I click on the menu, I would like it to open a modal with a calendar so that I can select the appropriate date. However, when I click on a particular day, the modal closes. Can I, someone help me or direct what could be the cause? I’ve been struggling with this for a few days now and unfortunately I’m resigned 😦

Here’s a link to the code sketch so you can familiarize yourself with the code: https://codesandbox.io/s/gracious-brahmagupta-3wd9vt

I would like that when you click on a day in the calendar modal does not disappear and you can perform an action on the selected date.

Tags:

2

Answers


  1. 0

    enter image description here

    After running your code, I found that the popover disappears not only when clicking on the calendar, but also when clicking on the blank area of the popover. This indicates that the issue lies with the popover-content. After locating its source code, I commented out line 169 and found that the popover does not automatically disappear when clicking on the calendar or the blank area. This way, you should be able to select a date. This problem is with the source code and not with your code, so don’t be discouraged.

    Login or Signup to reply.
  2. 0

    Yes, I overlooked this issue. Just make the modifications as shown in the two images below. I tried it this time, and the popover menu works fine.

    enter image description here

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search