Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I got a div tag which initially is set to have display:none and will later be convert into a dialog:

 @* To load the create dialog *@
  <div id="createdialog">
  </div>

I load a partial view into the dialog like this:

 // Dialog for create food
        var controllerUrl = '/Food/CreateFood';
        $('#createdialog').append($('#loading'));
        var $createdialog = $('#createdialog').load(controllerUrl).dialog({
            autoOpen: false,
            title: 'Create Food',
            modal: true,
            // To set the dialog width to full width
            width: 'auto',
            // Call the clear function without '()'
            close: clear
        });

And then i open it inside the jquery ui drop event once user drop something:

        $.validator.unobtrusive.parse($createdialog);
        $createdialog.dialog('open');

So it means that my dialog is actually created on demand, so I cant pre-load the dialog content. I need to display a loading image and hide it once everything is done loaded in the dialog. But I just cant get it work...Hope can get some help here....

Appreciate any feedback...Thanks...

share|improve this question

1 Answer

up vote 0 down vote accepted

I somehow figure it out. I use the .load() callback instead. Just to show my way here:

 // Use the load callback to open dialog to ensure content is loaded
        $createdialog.load(controllerUrl, function () {
            $('#loading').hide();
            $createdialog.dialog('open');
        });

Thanks!

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.