jQuery UI的对话框 - 添加“加载”的形象，而对话内容仍在加载

Question

我最初被设定为具有显示div标签：none和稍后将转换成一个对话框：

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

我加载的局部视图在对话框中是这样的：

// 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 
     }); 

然后我打开它，一旦用户放置东西jQuery UI的下降事件中：

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

所以这意味着我的对话框实际上是按需创建的，所以我不能预加载对话框内容。我需要显示一个加载图像，并在所有对话完成后将其隐藏。但我只是不能得到它的工作...希望可以在这里一些帮助....

欣赏任何反馈...谢谢...

Answer 1

我有点弄明白。我使用.load（）回调代替。只是为了展示我的方式：

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

谢谢！