mdehoog / Semantic-UI-Calendar

Calendar module for Semantic UI
MIT License
805 stars 127 forks source link

use in the modal not working #77

Closed BoleLee closed 7 years ago

BoleLee commented 7 years ago
import "semantic-ui-calendar/dist/calendar.css";
import "semantic-ui-calendar/dist/calendar.js";

I import semantic-ui-calendar like this, however it didn't work, I'm not sure what's wrong?

BoleLee commented 7 years ago

I'm sorry that it wasn't the calendar problem, in my project, I use both semantic and semantic-ui-calendar, in some places, calendar didn't work, in another place, popup didn't work, I haven't find the reason.

BoleLee commented 7 years ago

I found that only when the calendar or popup is in the modal, it didn't work.

mdehoog commented 7 years ago

See #21 #33 #40.

BoleLee commented 7 years ago

the popup or calendar didn't show in the modal, because the popup has a default setting: observeChanges: true. when the modal is initialized:

"The modal component always moves a modal’s HTML from its original place in DOM to a certain wrapper during the initialization", and "The popup’s mutationObserver sees that the modal’s HTML was removed and destroys the popup."

To solve the problem:

  1. setting observeChanges to false in the calendar code at line about 140;
  2. initial the calendar after the modal was initialized.

the answer is from semantic-ui issue 4860#issuecomment-297702810