Search code examples
javascriptjquerysimplemodal

Display content from url inside jquery simplemodal


I want to load this content https://www.paypal.com/uk/cgi-bin/webscr?cmd=xpt/Marketing/popup/OLCWhatIsPayPal-outside in to jquery simplemodal dialog.

How can i do that?

UPDATE

I've tried this sample:

$('#paypal-popup').click(function (e) {
            var src = "http://365.ericmmartin.com/";
            $.modal('<iframe src="' + src + '" height="450" width="830" style="border:0">', {
                closeHTML: "",
                containerCss: {
                    backgroundColor: "#fff",
                    borderColor: "#fff",
                    height: 450,
                    padding: 0,
                    width: 830
                },
                overlayClose: true
            });
        });

and it is working for me, but if i change src url to https://www.paypal.com/uk/cgi-bin/webscr?cmd=xpt/Marketing/popup/OLCWhatIsPayPal-outside it is redirecting me there.

How may i fix that?


Solution

  • Whatever library you use, you cannot load the content of that url in an iframe.
    It will surely get re-directed because there is a small script running in it.

    If you view source on that page you can see this.

    <style type="text/css" id="antiClickjack">
        body{display:none !important;}
    </style>
    <script type="text/javascript"> 
        if (self === top) {
            var antiClickjack = document.getElementById("antiClickjack");
            antiClickjack.parentNode.removeChild(antiClickjack);
        } 
        else {
            top.location = self.location;
        }
    </script>
    

    This means if the page is in an iframe, hide contents and change the pages location to iframe's location.
    Its there to prevent Clickjacking

    If you want to display any other sites in an iframe, just use jQuery UI Dialog.
    Demo: http://jsfiddle.net/naveen/C6rR2/1/