title: Attach knockout in parent file and use it in iframe
body: <p>My application is based on knockout and the big hurdle for me is as follows:</p>
  
  <ol>
  <li>I've attached required JS files in main parent file</li>
  <li>I've used an approach to refer to these files in iFrame. For example jQuery defined only in parent and just refer to it from iframe defining it's object in iframe.</li>
  <li>Similarly I am able to define knockout object and use it but, THE ISSUE is that - bindings on the iframe page is not working</li>
  <li>If i use alert to check if the functions of knockout works or not, it is working. Only the form fields and data-bindings are not working</li>
  </ol>
  
  <p>Any clue?</p>
  
  <p>Here is the code:
  Parent file (under head):</p>
  
  <pre><code> &lt;script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="Scripts/jquery-ui-1.8.20.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p></p>
  
  <p>(under body)</p>
  
  <pre><code>&lt;iframe src="IframePage.html" width="100%" height="100%" id="popUpIframe" marginwidth="0" marginheight="0" frameborder="0" scrolling="auto"&gt;&lt;/iframe&gt;
  </code></pre>
  
  <p>Iframe File:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;   
      var $ = parent.$;
      var ko = parent.ko;    
      $(document).ready(function () { 
          var ViewModel = function (first, last) {
              this.firstName = ko.observable(first);
              this.lastName = ko.observable(last);
  
              this.fullName = ko.computed(function () {
                  alert(this.firstName() + " " + this.lastName());
                  return this.firstName() + " " + this.lastName();
              }, this);
          };        
           ko.applyBindings(new ViewModel("Kawal", "Babra"));
      });
  &lt;/script&gt;
  &lt;p&gt;First name: &lt;input data-bind="value: firstName" /&gt;&lt;/p&gt;
  &lt;p&gt;Last name: &lt;input data-bind="value: lastName" /&gt;&lt;/p&gt;
  &lt;h2&gt;Hello, &lt;span data-bind="text: fullName"&gt; &lt;/span&gt;!&lt;/h2&gt;
  </code></pre>