bootstrap-3-modal icon indicating copy to clipboard operation
bootstrap-3-modal copied to clipboard

Modal does not open after hide

Open marktomm opened this issue 9 years ago • 6 comments

Reproduction

I don't know if I am doing something fundamentally wrong here, but if I call a Modal.show(...) right after Modal.hide() the modal window is not displayed.

I encountered this quirk, when trying to implement modal windows appearing one after another in a sort of step-by-step procedure - modal window appears and based on buttons clicked in that window another one appears. Putting the second Modal.show(...) in a Meteor.setTimeout() like in the example below

Modal.show('exampleModal');
Modal.hide();
Meteor.setTimeout(function() {
  Modal.show('exampleModal2')
  }, 1000);

circumvents this issue and I think that using Template.dynamic similar to the approach shown here will also work (although fade-in fade-out effect will be lost in that case), but I would like to know if I am doing something wrong with my initial approach.

Thank You!

marktomm avatar Jan 19 '16 20:01 marktomm

See this. By default, only one modal is shown at a time. If you want to show a modal before another one has completely closed you need to have Modal.allowMultiple = true in your code. But you should only use this one if you want to show multiple modals at once, which doesn't seem to be your case.

But first of all, showing one modal directly after another, does that really provide a nice user experience? I don't think so, and I don't recommend you to use it. However, if you're eager to use it, I can try to find the time (or you can do it yourself) to add a callback to the hide method which will be called when the modal has been removed. I think this makes sense, but I will only implement it if you actually going to use it.

PeppeL-G avatar Jan 20 '16 10:01 PeppeL-G

Yes, I believe there's a race condition where the first modal is not actually removed yet when the trying to display the 2nd modal. Modal.allowMultiple = true does "fix" the issue.

cormip avatar Apr 25 '16 21:04 cormip

My problem is I have 3 different modals (add, modify and delete). When I start the application one modal works but after a couple of modify actions, all the modals stop working... I have only one modal open at a time so I don't think Modal.allowMultiple = true is needed. I open only the modal when the other one is closed... Any thoughts on this?

Thanks a lot

Silenco avatar Feb 02 '17 13:02 Silenco

@Silenco, you're right, Modal.allowMultiple = true should not be needed in your case, and what you're trying to do should be possible, so it's strange that it stops to work after a while. You don't get any error messages in the console?

I haven't used Meteor for a long while, so they may have changed something that breaks this package by now. I'm especially thinking of this line of code.

PeppeL-G avatar Feb 02 '17 18:02 PeppeL-G

I know this is an old topic but I come to this problem recently. Any improvement on the subject?

Thanks in advance

poluxus avatar Dec 01 '17 21:12 poluxus

@poluxus, I haven't touched Meteor for ~2 years now, so no improvement. Do you get any error message? I'm still suspecting this line of code is the cause of the error, but your error message might be able to verify this.

PeppeL-G avatar Dec 03 '17 08:12 PeppeL-G