Problem mit Knockout-Bindung konfrontiert

Question

Ich habe mehrere Registerkarten (A, B, C) und beim Laden von 'C' Registerkarte sollten die Modelleigenschaften Daten-Registerkarte auf Registerkarte 'c'. Ich bin mit Datenbindung konfrontiert.

Die drei Registerkarten (A, B, C) sind in einer anderen Ansicht Ansicht A.

Hier ist meine VIEW A

<div id="tabMain" style="width:1230px;height:auto;overflow:auto;"> 
        <ul> 
         <li><a href="#A">A</a></li> 
         <li><a href="#B">B</a></li> 
         <li data-bind="click:loProvision"><a href="#C">C</a> 

Here is my Tab 'c' 



<div id="SubC"> 
<ul> 
     <li><a href="#tabC1">tabc1</a></li> 
</ul> 
     <div id="tabC1" style="overflow:auto;"> 

     <div> 
      @Html.HiddenFor(m => m.UID) 
      <div style="width:500px;height:20px;margin-left:30px"> 
      <div >@Html.NCheckBoxFor(m => m.EnablePD, new { id = "cbPD", style = "vertical-align:middle;", data_bind = "checked:enablePD" }, Model.IsReadOnly)</div> 
      <div > 
       <label for="cbOrgDetailsPD">@Res.OrganizationStrings.Ect</label> 
      </div> 
      </div> 
      <div style="width:100%;margin-top:10px;margin-left:30px"> 
      <div style="width:22%;"> 
       <label for="ddPD">Strings.PlaceUsersInGroup</label> 
      </div> 
      <div style="width:45%">@Html.NDropDownListFor(m => m.PD, Model.groups, new { id = "ddPD", style = "width:270px;height:25px;vertical-align:middle;", , data_bind = "enable: enablePD" 
       }, Model.IsReadOnly)</div> 
      </div> 
      <div style="margin-top:20px;margin-left:30px"> 
      <div >@Html.NCheckBoxFor(m => m.ProType, new { id = "cbType", style = "vertical-align:middle;", data_bind = "checked:enableing" }, Model.IsReadOnly)</div> 
      <div > 
       <label for="cbByType">@Res.Strings.Enableing</label> 
      </div> 
      </div> 
     </div> 
     </div> 

Die Ansicht, die enthält die Registerkarten, um die Viewmodel ist mit und ich will um die "c" -Komponenten der Registerkarte zu binden, wenn die Registerkarte "c" geladen ist.

Hier ist mein Javascript-Code:

function Intialize { 
     var model = new MainviewModel(); 
     ko.applyBindings(model, document.getElementById(orgDetailsTab.getId())); 
    } 

    function MainviewModel() { 
     this.loadvision = function() { 
     if (isvisionsLoaded === false) { 

      var autoUrl = '/Org/OrgView?UID=' + UID + '&isReadOnly=' + isReadOnly; 
      loadvision(); 
     } 
     }; 

    } 
    var CAPDModel; 

    function loadvision() { 
     try { 
     $('#C').empty(); 
     $.ajaxSetup({ 
      cache: false 
     }); 
     $('#C').load(visionUrl, function(responseText, textStatus, XMLHttpRequest) { 

       $("#SubC").tabs().addClass("ui-tabs-vertical ui-helper-clearfix"); 

       isLoaded = true; 

       CModel = new organizationViewModel(); 
       ko.applyBindings(CModel, document.getElementById(tabC1)); 

       function orgViewModel() { 
       this.enablePD = ko.observable($('#cbOrgPD').is(':checked')); 
       this.enableCing = ko.observable($('#cbType').is(':checked')); 
       this.enableLicense = ko.observable($('#cbOrgDetailsLicenses').is(':checked')); 
       this.cansee = ko.observable(false); 
       this.canRemove = ko.observable(false); 
       } 

      } 

Ich erhalte Ausnahme bei

ko.applyBindings (CModel, document.getElementById (tabC1));

Meine Anforderung ist auf die Belastung von Tab 'tabC1' die HTML-Attribute sollten datengebunden sein (Deaktivieren und Aktivieren von HTML-Feldern) sollte passieren.

Ich habe ursprünglich die CAPD-Eigenschaften in 'MainviewModel' platziert, aber die Bindung ist nicht passiert.

Also habe ich die C-Eigenschaften von 'MainviewModel' zu 'TabC1' Ladefunktion verschoben, aber die Datenbindung passiert nicht.

Also habe ich ein neues Viewmodel innerhalb der 'TabC1'-Div loadFunktion erstellt und versucht, Bindungen auf die Last von div' tabC1 'anzuwenden.

Kann jemand eine Anleitung, wenn der Ansatz falsch ist oder lassen Sie mich wissen, wie kann ich es erreichen. Hier

sind die Fehlerdetails i bin vor bei

ko.applyBindings(CModel, document.getElementById(tabC1)); 

Unhandled exception at line 26076, column 17 in eval code 

0x800a139e - JavaScript runtime error: Unable to parse bindings. 

Message: ReferenceError: 'loadvision' is undefined; 

Bindings value: click:loadvision 

Answer 1

ich die Lösung für das oben genannte Problem gefunden, ich die Zeile geändert

ko.applyBindings(CAPDModel, document.getElementById(tabC1)); changed to 

ko.applyBindings(CAPDModel, $("#tabC1")[0]);