Compartilhar via

Open SharePoint Url in dialog using Jquery UI dialog

  • Artigo

Some time we need to open the SharePoint pages from other technologies like PHP or other web technologies. We can use Jquery UI top open the dialog page. The samples in jquery UI https://jqueryui.com/dialog/ does't give any sample on how to open a URL in the dialog. The below sample works for opening the URL in JQuery UI dialog.

 

<!DOCTYPE html>
<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<title>Modal Dialog</title>

<script type="text/javascript">

    $(function () {
        $("#dialog").dialog({
            autoOpen: false,
            show: "fade",
            hide: "fade",
            modal: true,
            open: function (ev, ui) {
                $('#myIframe').src = 'https://www.google.com';
            },
            height: 900,
            width: 1150,
            resizable: true,
            title: 'User Profile'
        });

        $("#opener").click(function () {

            $("#dialog").dialog("open");
            return false;
        });
    });

</script>

</head>
<body>
<div id="dialog">  
   <iframe id="Iframe1" style="width: 1100px; height: 800px;" src="https://sharepoint:2010/"></iframe>
  <div id="divInner"></div>
</div>
<button id="opener">Open Dialog</button>
 
</body>
</html>