Monday, December 21, 2015

Display jquery dialog in parent window

The example below is a simple way to display a dialog in the parent window from an iframe.
  • Include jquery and jqueryui into your parent window
  • After this you can access to the parent JQuery object within iframe
   <script type="text/javascript">
         $(document).on("click", "[id*=btnShowPopup]", function () {
            var $jParent = window.parent.jQuery.noConflict();
            var dlg1 = $jParent('#editGiveawayDialog');
              dlg1.dialog({
               title: "Display Dialog",
               width: 550,
               height: 300,
               zIndex: 10000,
                 buttons: {
                   Ok: function () {
                     dlg1.dialog('close');
                   },
                   Cancel: function () {
                     dlg1.dialog('close');
                   }
                  },
                   modal: true
               });
               return false;
           });
            </script>

Hope this helps! :)