How do you add an iframe to a view in sproutcore?

Question

I've got some legacy code to work with and I have no experience with Sprout Core. Searching for the answer has proven inconclusive.

Basically, I need to just an add an iframe to an already existing view, and be able to set the src URL.

Answer 1

While you can render a fixed iframe very easily using the render function, there is also a SproutCore view, SC.WebView , that does this for you in the :desktop framework. You should use SC.WebView if you expect the src to change or if you want to resize the iframe to match the size of its contents.

For example,

myWebView: SC.WebView.extend({
  layout: { left: 10, right: 10, top: 10, bottom: 10, border: 1 },
  shouldAutoResize: true, // when the iframe loads, resize it to fit the size of its content
  valueBinding: SC.Binding.oneWay('MyApp.currentUrl') // bind the 'src' of the iframe
})

Answer 2

There are a few ways to do this.

Assuming the view extends from SC.View , the easiest is probably to override the #render method and add the iframe yourself:

MyApp.MyView = SC.View.extend({
  render: function(context) {
    context.push("<iframe src='http://google.com' />");
  }
});