Materialize: Close any open modal?

Created on 21 Sep 2015  路  4Comments  路  Source: Dogfalo/materialize

I'm trying to figure out if there's a way to close any other already open modals when I try to open another. For example. If I have a login modal and inside that I have a trigger to open a password reset modal. How would I have the login modal close automatically when I trigger password reset modal? Ideally without having to directly specify something like $("loginModal").closeModal() I would rather do something that catches any open model.

This is what I have:

// Login modal
$(function () {
  // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
  $('.modal-trigger').leanModal({
    dismissible: true, // Modal can be dismissed by clicking outside of the modal
    opacity: .7, // Opacity of modal background
    in_duration: 400, // Transition in duration
    out_duration: 200, // Transition out duration\
  });

  // When click on sign up hide login and open sign up
  $('a.signup-btn').click(function() {
    // Close login modal
    $('#login-modal').closeModal();
    $('#password-modal').closeModal();
  });

  // When click on sign up hide login and open sign up
  $('a.login-btn').click(function() {
    // Close signup modal
    $('#signup-modal').closeModal();
    $('#password-modal').closeModal();
  });

  // Hide login modal and open forgot password modal
  $('a.password-btn').click(function() {
    // Close login modal
    $('#login-modal').closeModal();
  })
});

Is there something I could add to the ready function?

something like:

  $('.modal-trigger').leanModal({
    dismissible: true, // Modal can be dismissed by clicking outside of the modal
    opacity: .7, // Opacity of modal background
    in_duration: 400, // Transition in duration
    out_duration: 200, // Transition out duration,
    ready: function() { CLOSE ANY OPEN MODAL }
  });

Most helpful comment

Maybe a bit late, but it's working.

$('.modal.open').modal('close')

All 4 comments

Add the part of the reset password (as hidden) into the login modal, by this way you avoid opening multiple modals simultaneously.

@TyrionGraphiste sorry, I'm not following.

@simkessy Can you provide a working codepen, using the latest version, to help us understand the problem? Btw leanmodal is deprecated.

Maybe a bit late, but it's working.

$('.modal.open').modal('close')

Was this page helpful?
0 / 5 - 0 ratings

Related issues

onigetoc picture onigetoc  路  3Comments

acierpinski picture acierpinski  路  3Comments

PhillippOhlandt picture PhillippOhlandt  路  3Comments

heshamelmasry77 picture heshamelmasry77  路  3Comments

MickaelH974 picture MickaelH974  路  3Comments