Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Modal ajax loading indication. #10911

Closed
undsoft opened this issue Oct 2, 2013 · 4 comments
Closed

Modal ajax loading indication. #10911

undsoft opened this issue Oct 2, 2013 · 4 comments
Milestone

Comments

@undsoft
Copy link

undsoft commented Oct 2, 2013

Hello,

If I use remote modal dialogs, right now there is no native way for me to inform user that his content is loading. On slow connections this could be frustrating.

I know that there are ways to work around this, but why not have a better solution right out of the box?

For example, you could be adding .modal-loading class to the modal element when content is loading, so that I can style it with css.

modal.js, line 32:

        if (this.options.remote) {
            var that = this;
            this.$element.addClass('modal-loading');
            this.$element.load(this.options.remote, function(){
                that.$element.addClass('modal-loading');
            });
        }

Adding events may also be a nice solution.

@cvrebert
Copy link
Collaborator

cvrebert commented Oct 2, 2013

Given that proposals to emit a loaded event have been rejected in the past, adding a loading event seems unlikely to happen.

@Merg1255
Copy link

Merg1255 commented Oct 2, 2013

It is an essential feature though for distributing content into chunks and loading them in the modal. mdo, plz take a look at the loaded event.

@allenp
Copy link

allenp commented Oct 4, 2013

As a work around for now I put the "Loading..." message in the placeholder div typically a:

<div id="dialog">Loading. Please wait...</div>

This gets replaced once the content completes loading.

Then you can have a script that resets this loading message once the dialog is closed if your dialog needs to be re-created on each click:

jQuery(function($) {
  $(document.body).on('hidden.bs.modal', '#dialog', function (event) {
    $(this).removeData('bs.modal');
      $(this).html('Loading. Please wait...');
     });
});

@fat fat closed this as completed in c595db1 Dec 27, 2013
@fat
Copy link
Member

fat commented Dec 27, 2013

just went ahead and added the loaded event. you can hook into that if you'd like

@mdo mdo mentioned this issue Dec 27, 2013
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants