диалога Jquery, чтобы открыть другую страницу

Question

Существует страница, как transaction.html

Как открыть эту страницу во всплывающем окне в другой странице говорит show_transactions.html в JQuery диалогового

 $dialog.html() //open transaction.html in this dialog 
    .dialog({ 
     autoOpen: true, 
     position: 'center' , 
     title: 'EDIT', 
     draggable: false, 
     width : 300, 
     height : 40, 
     resizable : false, 
     modal : true, 
    }); 
    alert('here'); 
    $dialog.dialog('open'); 

Этого код присутствует в show_transactions.html

Спасибо ..

Answer 1

Вы можете использовать .load() метод JQuery для загрузки страницы в диалог, вот как:

$("#dialog").dialog({ 
    autoOpen: false, 
    position: 'center' , 
    title: 'EDIT', 
    draggable: false, 
    width : 300, 
    height : 40, 
    resizable : false, 
    modal : true, 
}); 

$("#dialog_trigger").click(function() { 
    $("#dialog").load('path/to/file.html', function() { 
     $("#dialog").dialog("open"); 
    }); 
}) 

Это предполагает, что диалог имеет идентификатор «диалога» и что есть еще один элемент с идентификатором «dialog_trigger», который кликнули, чтобы открыть его. Вы поместили бы оба из них в готовую функцию вашего документа, чтобы диалог был сделан на загрузке страницы, если это не так, это приведет к небольшой, но заметной задержке для пользователя, как он сделан.

Answer 2

Вы также можете сделать так ...

Создать диалог

<div id="MyDialogID" title="My Dialog Title"></div> 

Создать ссылку (когда мы нажимаем на эту ссылку она откроется диалоговое окно)

<a id="MyLinkToDialogID" href="Path to Dialog Page">Open My Dialog</a> 

Инициировать диалог (создать n между ссылкой и диалогом)

$('#MyLinkToDialogID').each(function() { 
    var $link = $(this); 

    $.post($link.attr('href'), function (data) { 
     var $dialog = $(data) 
      .filter('#MyDialogID') 
      .dialog({ 
       autoOpen: false, 
       resizable: false, 
       height: 240, 
       width: 370, 
       modal: true 
      }); 

      $link.click(function() { 
       $dialog.dialog("open"); 
       $dialog.css("height", "240"); 
       $dialog.css("width", "370px"); 
       $dialog.dialog({ position: 'center' }); 

       return false; 
      }); 
    }); 
});