ericmmartin / simplemodal

A modal dialog framework for jQuery
http://simplemodal.com/
Other
507 stars 229 forks source link

Iframe called twice (Chrome) #48

Open twistedvibe opened 10 years ago

twistedvibe commented 10 years ago

I've been using this for sometime and have had no issues up until now.

I have an iframe within the modal dialog (with a loader image behind it whilst it loads in).

The iframe page is called twice (I can tell this server side). It appears related to onOpen, if onOpen is removed the the iframe only gets called once.

Great dialog by the way - very impressive I've found it very useful. If this can be resolved I'll be happy to donate.

twistedvibe commented 10 years ago

I use the following code to call simple modal:

templatemodaldialogopen

twistedvibe commented 10 years ago

UPDATE: This appears to only affect Google Chrome!

rollisoj commented 9 years ago

I am having the same problem however it happens in IE as well as Chrome. I can get rid of the problem by commenting out the appendTo('body'); section in the jquery.simplemodal-1.4.4.js but then the modal is not centered correctly when it is shown.

        // add styling and attributes to the data
        // append to body to get correct dimensions, then move to wrap
        s.d.data = data
            .attr('id', data.attr('id') || s.o.dataId)
            .addClass('simplemodal-data')
            .css($.extend(s.o.dataCss, {
                    display: 'none'
            }))
            //.appendTo('body');
        data = null;

Any ideas on how to resolve this?

alfasapy commented 9 years ago

@rollisoj This is how I resolved it. I am using simplemodal v1.4.5, tested in Chrome and IE10

Remove and save the original Src before the data is first appended to the body

var iframeElement = $(data.find('iframe')[0]);
var savedSrc = iframeElement.prop('src');
iframeElement.prop('src','about:blank');
s.d.data = data
...

Right before data is appended to the wrap element, you can bring back the Src

// Reinstate src
// IE10 will trigger a request on src prop update, remove from DOM
s.d.data.detach();
$(s.d.data.find('iframe')[0]).prop('src', savedSrc);
s.d.data.appendTo(s.d.wrap);