2014-01-20 14 views
5

私が扱っているページにはいくつかのタブがあり、コントローラからの部分的な表示を要求することによって、各タブの内容がajax経由で読み込まれます。問題は、パーシャルビューがknockoutjsを使用するため、ビューモデルにバインドされていることです。この特定のシナリオでは、ページ全体が初めて読み込まれるため、すべてのバインディングが正常に動作します。タブを切り替えると、部分的な表示が要求され、タブのコンテンツ領域が新しいページに置き換えられます。最初のタブに戻ると、ノックアウト・バインディングがすべて失われているように見えることを除いて、部分的にロードされます。欠落しているデータがたくさんあります。ページがajax経由で部分的に読み込まれたときにノックアウトビューモデルを再バインドするにはどうすればよいですか?

jqueryがそのポイントでロードされていないため、viewmodel宣言とモデルバインドを部分的に配置することはできません。それで、($は定義されていない)ように見えます。

ビューモデルは、パーシャルビュー自体を呼び出すのではなく、部分ビューを呼び出すメインページで宣言され、バインドされているため、モデルはまだ使用可能であり、正常にバインドできると思っていました。私はこれが間違っていることを知っている、そして部分的な見解はjavscriptになると非常にうねっているので、皆さんから少しの洞察を盗むことを望んでいる。ページの非オーバーラップの特定の領域に結合することが可能であるならば、あなたはこの答えのようko.applyBindings(someViewModel, someDomElement)を呼び出すために選択することができ enter image description here

答えて

7

は、ここで基本的な設定だCan you call ko.applyBindings to bind a partial view?

しかし、ページにバインドされた全体的なビューモデルと、後でバインドする部分を介してロードされたコンテンツの「島」がある場合、1つのオプションは次のようになります。http://www.knockmeout.net/2012/05/quick-tip-skip-binding.htmlだから、部分的にどこに行くのコンテナにバインディングを設定して、Knockoutにそのエリアから手を離しておくように指示します。その後、部分を読み込むと、安全にko.applyBindings(someViewModel, innerContainer)を呼び出すことができます。

結合は、次のようになります。

ko.bindingHandlers.stopBinding = { 
    init: function() { 
     return { controlsDescendantBindings: true }; 
    } 
}; 

、あなたは次のようにそれを使用します。ko.applyBindings(someViewModel, document.getElementById("innerContainer"));

、その後

<div id="outerContainer" data-bind="stopBinding: true"> 
    <div id="innerContainer"> 
    ...load your partial here 
    </div> 
</div> 

関連する問題