Reputation: 3043
I am trying to get a modal loading dialog to pop up while I make an ajax call but it is not showing up in the onClick function. If I slow it down with firebug and step through the loading panel will show up. Is this just javascript running ahead of itself? Is there a better way to do this?
$(function(){
$("#loading_panel").dialog({
modal:true,
position:'center',
minHeight:40
});
$("a.view-in-frame").click(function(){
$("#loading_panel").dialog('open');
$("#tabs").hide();
var blog = $(document.createElement('div')).attr('id', 'blog').load(('blog_reader.php?blog='+this.href)), $("#loading_panel").dialog('close'));
$("#content_wrap").append(blog);
return false;
});
})
Upvotes: 6
Views: 3438
Reputation: 1131
@ErsatzRyan
Have you tried set your javascript function to load after your document is ready?
Like this:
$(document).ready(function(){
//Your functions
});
And as @Nat Ryall said, you must set your autoOpen to false
, otherwise your dialog won't open twice.
And another thing, try to call your $(".selector").dialog("open")
after you done everything. You're telling your function to call your dialog before it has loaded it's content.
Upvotes: 1
Reputation: 12281
Just an idea, try setting the 'autoOpen' to false when creating the dialog:
$("#loading_panel").dialog({
modal:true,
position:'center',
minHeight:40,
autoOpen:false
});
At the moment you are telling the dialog to open when it is created. This should prevent that behaviour.
Upvotes: 1