如何从对话框中重新加载jQuery对话框？

我在jQuery Dialog中加载页面。 ajax命令完成后，我希望能够重新加载jQuery Dialog中的同一页面。如何从Dialog中加载的页面内重新加载jQuery Dialog？如何从对话框中重新加载jQuery对话框？

父页（Blah.aspx）：

<script type="text/javascript"> 
    function view_dialog() { 
     $('#dialog').load('blah2.aspx').dialog({ 
      title: 'test' , 
      modal: 'true', 
      width: '80%', 
      height: '740', 
      position: 'center', 
      show: 'scale', 
      hide: 'scale', 
      cache: false }); 
    } 
</script> 

<asp:Content 
    ID="Content2" 
    ContentPlaceHolderID="ContentPlaceHolder1" 
    runat="server"> 

    <input id="Button1" onclick="view_dialog()" type="button" value="button" /> 
    <div id="dialog" style="display: none"></div> 

</asp:Content>

对话内容页面（blah2.aspx）：

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     function doit() { 
      var request = $.ajax({ 
       url: "someurl", 
       dataType: "JSON", 
       data: { 
        a: 'somevalue' 
       } 
      }); 

      request.done(function() { 
      //refresh the current dialog by calling blah2.aspx again 
     }); 
    }  
</script> 

<asp:Content 
    ID="Content2" 
    ContentPlaceHolderID="ContentPlaceHolder1" 
    runat="server"> 

    <input id="Button1" onclick="doit()" type="button" value="button" /> 

</asp:Content>

来源

2012-04-30 Rob

您正在加载从另一个网页内容到对话框容器在当前页面，所以这里真的只有一个页面。我建议只从对话框源页面加载部分html（没有<head>或<body>标签）。

所以，你可以摧毁对话框并重新创建它重新加载对话内容：

function reload_dialog() 
{ 
    $('#dialog').dialog('destroy'); 
    view_dialog(); 
} 

function view_dialog() { 
    $('#dialog').load('blah2.aspx').dialog({ 
     title: 'test' , 
     modal: 'true', 
     width: '80%', 
     height: '740', 
     position: 'center', 
     show: 'scale', 
     hide: 'scale', 
     cache: false }); 
}

或者，您可以重新加载整个页面。

window.location.reload();

来源

2012-04-30 20:35:45 jrummell

谢谢！我知道这已经过了4年，但是你的代码非常帮助我！ – Markoh

可以在jQuery的延长ui.dialog这样的：

$.ui.dialog.prototype.options.url; // Define a new option 'url'

现在，你可以更换整个对话“创造”，因此它会自动加载URL，并确定新的“刷新”选项：

// Replace the _create event 
    var orig_create = $.ui.dialog.prototype._create; 
    $.ui.dialog.prototype._create = function(){ 
     orig_create.apply(this,arguments); 
     var self = this; 
     if(this.options.url!=''){ 
      self.element.load(self.options.url); // auto load the url selected 
     }; 
    }; 

    $.widget("ui.dialog", $.ui.dialog, { 
     refresh: function() { 
      if(this.options.url!=''){ 
       this.element.load(this.options.url); 
      } 
     } 
    });

你最后的功能应该是这样的：

// Note the "url" option. 
function view_dialog() { 
    $('#dialog').dialog({ 
     url:'blah2.aspx', 
     title: 'test' , 
     modal: 'true', 
     width: '80%', 
     height: '740', 
     position: 'center', 
     show: 'scale', 
     hide: 'scale', 
     cache: false }); 
} 


// refresh: 
$('#dialog').dialog("refresh");

您可以在此小提琴中看到最终代码：http://jsfiddle.net/WLg53/1/

来源

2014-05-08 13:21:19 Phoenix

如何从对话框中重新加载jQuery对话框？

回答

相关问题