title: Mixed Content Warning in IE8 With JQuery UI Modal Dialog
body: <p>I'm using JQueryUI's Dialog as a Modal window, and loading another page into the modal window using the method outlined here: <a href="http://blog.nemikor.com/2009/08/07/creating-dialogs-on-demand/" rel="nofollow">http://blog.nemikor.com/2009/08/07/creating-dialogs-on-demand/</a></p>
  
  <p>The modal window is generated (see my code below), and it works great in Firefox, but in IE8, I get the dreaded mixed content warning (the site is being served up via HTTPS, and all my checks in Firebug show that everything has relative paths and is all coming from the same site as the page generating the modal. What's even more frustrating is with the mixed content warning, you're supposed to be able to answer 'no' to the prompt IE gives you, and then it should load the mixed content - but all I get is a blank modal window. It also strangely does not turn the overlay area transparent, even though non-generated modals (the modal contents are in a hidden DIV on the same page) on the same site work just fine in IE and create the modal with the transparent overlay.</p>
  
  <p>I'm using JQuery 1.4.2 with JQueryUI 1.8.2, and below is my modal window code along with the code that gets the content based on the a href clicked.</p>
  
  <pre><code>$('.actionlink').each(function() {
      var $dialog = $('&lt;div&gt;&lt;/div&gt;');
      var $link = $(this).one('click', function() {
          $dialog
          .load($link.attr('href') + ' #modalWrapper')
          .dialog({
              resizable: false,
              modal: true,
              //autoOpen: false,
              title: 'Printable Action Items',
              width: 700,
              height: 'auto',
              buttons: {
                  "Close": function() {
                      $(this).dialog("close");
                  }
              }
          });
  
      $link.click(function() {
          $dialog.dialog('open');
  
          return false;
          });
          return false;
      });
  });
  </code></pre>
  
  <p>And here's the href that provides the page to insert into the modal window:</p>
  
  <pre><code>&lt;a href="https://#cgi.server_name#/matters/viewprintableactions.cfm?matterid=#matterid#&amp;asserter=#urlencodedformat(asserter)#" class="actionlink"&gt;&lt;img src="/images/page_alert.png" width="16" height="16" border="0"&gt;&lt;/a&gt;
  </code></pre>
  
  <p>The reason for doing it this way is there can potentially be multiple links like this on the page, and I need to provide a modal for every one, but do a separate query to get the information for the modal (hence why it's in another page). We also cannot change the user's browser settings to allow for the mixed content and avoid this (I wish).</p>
  
  <p>Anyone with advice or can see what the issue is here is greatly appreciated!</p>