想在jQuery中的页面刷新上使用Child Dialog

时间:2015-02-19 06:44:14

标签: jquery jquery-ui reload jquery-dialog

这是我的工作代码:

Working fiddle

 var dialog = $( "#dialog" ).dialog({
      autoOpen: false,
      modal: true,
      buttons: {
        Add: function() {
          addTab();
          $( this ).dialog( "close" );
        },
        Cancel: function() {
          $( this ).dialog( "close" );
        }
      },
      close: function() {
        form[ 0 ].reset();
      }
    });

当我单击“添加”选项卡时,它将显示一个jQuery对话框,并且在页面刷新时我无法看到对话框。

我想在页面刷新上保留jQuery对话框。

在这种情况下该怎么办?

1 个答案:

答案 0 :(得分:1)

您可以将sessionStorage用于此目的,如下所示(我只是在这里包含了代码的必需部分): -

$(function() { 

var dialog = $( "#dialog" ).dialog({
  autoOpen: false,
  modal: true,
  buttons: {
    Add: function() {
      addTab();
      $( this ).dialog( "close" );
        sessionStorage.setItem('flag','F') //set sessionStorage item to F
    },
    Cancel: function() {
      $( this ).dialog( "close" );
        sessionStorage.setItem('flag','F') //set sessionStorage item to F
    }
  },
  close: function() {
    form[ 0 ].reset();
      sessionStorage.setItem('flag','F') //set sessionStorage item to F
  }
});

if(sessionStorage.getItem('flag') == 'T') 
{
   dialog.dialog( "open" ); // if sessionstorage's flag is T then open the dialog on page load
}

// addTab button: just opens the dialog
$( "#add_tab" )
  .button()
  .click(function() {
    dialog.dialog( "open" );
      sessionStorage.setItem('flag','T')  // set sessionStorage item to T
  });

 $( "#add_tab_link" ).click(function(e) {
    e.preventDefault();
    //alert('clicked');
    dialog.dialog( "open" );
    sessionStorage.setItem('flag','T')  // set sessionStorage item to T
  });
});

Working Fiddle