Control.Modal : How to create an iframe from any element and load URL?

Have a need to create a modal iframe by clicking a button object (not an anchor/link.)

I can create the iframe with the proper URL using an anchor tag with href and ID.

I can create the iframe using a button object, but can't seem to feed it the url through Control.Modal (nor can I seem to reference the iframe using my own js.)

Any help/examples appreciated! (BTW, thanks for the sweet code, Ryan.)

Posted October 20th, 2007 at 11:32am by digibob

Hello,

Can you post a URL to your page, it's easier to diagnose that way.

Ben

Posted October 22nd, 2007 at 3:57am by bbodien

The simple solution (from a helpful colleague):

Open

function myIframe() { return new Control.Modal(false,{ contents: function() { return '' }, iframe: true, width: 200, height: 200, overlayCloseOnClick: false, containerClassName: 'modal', overlayClassName: 'overlay' }); }

Posted October 22nd, 2007 at 11:06am by digibob

The simple solution (from a helpful colleague):

<button onclick="myIframe().open();" type="button">Open</button>

function myIframe() {
   return new Control.Modal(false,{
       contents: function() { return '
<iframe allowtransparency="true" src="http://www.livepipe.net/" width="100%" height="100%" scrolling="no" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0"></iframe>
' },
       iframe: true,
       width: 200,
       height: 200,
       overlayCloseOnClick: false,
       containerClassName: 'modal',
       overlayClassName: 'overlay'
   });
}

Posted October 22nd, 2007 at 11:07am by digibob

Need to remove the PRE and CODE tags for the above to make sense.

Posted October 22nd, 2007 at 11:08am by digibob

Very elegant solution. I have a possible use for this but I am not sure how to best modify my current code. I currently use anchor links and pass the variables to the code below. Any suggestions would be appreciated.

$$('.edit_section').each (function (link) {
      new Control.Modal(link, {
        iframe: true,
        width: 680,
        height: 550,
        scrolling: 'yes'
      });
    });

<a href="areajump.cfm?patientid=#patientid#&aj=insurance" class="edit_section">Edit</a>
<a href="areajump.cfm?patientid=#patientid#&aj=employer" class="edit_section">Edit</a>
<a href="areajump.cfm?patientid=#patientid#&aj=guarantor" class="edit_section">Edit</a>
<a href="areajump.cfm?patientid=#patientid#&aj=general" class="edit_section">Edit</a>

Posted October 22nd, 2007 at 5:34pm by mrigotti