{"id":286,"date":"2011-06-26T13:04:47","date_gmt":"2011-06-26T13:04:47","guid":{"rendered":"http:\/\/www.sitekickr.com\/blog\/?p=286"},"modified":"2011-06-26T13:21:14","modified_gmt":"2011-06-26T13:21:14","slug":"jquery-dialog-load-external-url","status":"publish","type":"post","link":"https:\/\/www.sitekickr.com\/blog\/jquery-dialog-load-external-url\/","title":{"rendered":"jQuery dialog load external URL"},"content":{"rendered":"

The solution is simple, but coming to it was quite the opposite. After browsing many posts which don't deal with the fact that external URL can't be loaded via AJAX (ruling out the $.load() method), I came up with this simple solution:<\/p>\n

$('<iframe src="http:\/\/www.sitekickr.com\/" width="300" height="300" \/>').dialog({ modal: true, width: 300, height: 300});
\n\t<\/code><\/p>\n

Creating an IFRAME on the fly prevents you from bloating your HTML, while allowing you to load external content.<\/p>\n

Possible Issue<\/h3>\n

You may encounter an IFRAME that is "stuck" at a certain width, or doesn't fill the dialog completely. It seems that wrapping the IFRAME in a DIV resolves this issue.<\/p>\n

$('<div><iframe src="http:\/\/www.sitekickr.com\/" width="300" height="300" \/><\/div>').dialog({ modal: true, width: 300, height: 300});<\/code><\/p>\n","protected":false},"excerpt":{"rendered":"

The solution is simple, but coming to it was quite the opposite. After browsing many posts which don't deal with the fact that external URL…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"amp_status":""},"categories":[5,25],"tags":[86],"_links":{"self":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/286"}],"collection":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/comments?post=286"}],"version-history":[{"count":3,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/286\/revisions"}],"predecessor-version":[{"id":290,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/286\/revisions\/290"}],"wp:attachment":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/media?parent=286"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/categories?post=286"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/tags?post=286"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}