title: How to use knockoutjs binding on a Telerik editor?
body: <p>I'm trying to implement edit in place functionality for a description field, where editing is done using the telerik mvc editor. The editor needs to be hidden unless the user clicks on a span representing the editable section, and once done, hide the editor and have the marked up entry be placed in the editable element. </p>
  
  <p>I'm not sure where to apply the knockout binding so that whatever is entered into the telerik editor is shown in the span after the editor is hidden.The editor creates an iframe that contains the marked-up html that get's generated as the user enter's content. That markup is converted is stored as an html encoded value within a textarea that's just outside the iframe. </p>
  
  <p>If tried adding a bind to the textarea generated, but don't see the span bound with data-bind = "text: imgDescr" updating. </p>
  
  <p>Her'es the razor view</p>
  
  <pre><code>&lt;div&gt;
      &lt;span data-bind="text: imgDescr"&gt;&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;
  @{ Html.Telerik().Editor()
    .Name("editor")
    .HtmlAttributes(new {style = "height:400px"})
    .Encode(false)
    .Render();    
  }
  &lt;/div&gt;
  </code></pre>
  
  <p>and the js</p>
  
  <pre><code>function appViewModel() {
      this.ImgName = ko.observable(helpText);
      this.ImgDescr = ko.observable(helpText);
  }
  
  $('t-raw-content').attr('data-bind', "value: ImgDescr");
  
  // Activates knockout.js
  ko.applyBindings(new appViewModel());
  </code></pre>
  
  <p>Any suggestions on how this could be done? I also looked into using tinyMCE, but I think the rendering is handled in a similar manner.</p>