2016-11-07 114 views
1

我有一個網格,其中母公司格在MVVM構建內網格,孩子格在其數據細節的init初始化http://jsbin.com/kuvejuw劍道UI分層數據網格 - 如何從細節網格編輯模板MVVM訪問根視圖模型

<div data-role="grid" 
    data-columns="[ 
        { 'field': 'FirstName'}, 
        { 'field': 'LastName'} 
        ]" 
    data-bind="source: dataSource" 
    data-detail-init="viewModel.detailInit" 
    > 
</div> 

如果在viewModel上有一個自定義屬性(例如Text),並且在子網格的彈出編輯器中,我想綁定到此屬性。所以例如在更復雜的場景中,我可以通過在viewModel上創建一個數組(或可觀察數組)來填充具有一定範圍值的下拉列表。

var viewModel = kendo.observable({ 
    dataSource: new kendo.data.DataSource ... // everything works here, 
    detailInit: detailInit, 
    Text: "This text should be displayed in editor in detail's grid", 
}); 

kendo.bind(document.body, viewModel); 

的問題是,這個屬性(或整體視圖模型)是不是在細節網格的編輯器的模板檢測:

function detailInit(e){ 
...  
editable: { 
      mode: "popup", 
      template: kendo.template($("#child-editor-template").html()) 
     } 
... 
} 

模板是建立這樣的:

<script type="text/x-kendo-template" id="child-editor-template"> 
    <span data-bind="text: Text"></span> 
    </script> 

但我也試過data-bind="text:viewModel.Text"。我嘗試了各種解決方案,在detailGrid的編輯事件中將viewModel的Text屬性設置爲viewModel,或者將其設置爲viewModel bind,但它不適用於此jsBin(3.2016版本)。

現在有趣的是,我實際上能夠在我的本地項目中使用2015v3 Kendo UI訪問此屬性,但我無法在此jsBin中複製它。

在我的本地項目中,雖然我仍然無法訪問ViewModel中的事件,例如我可以做text: Text,但不能做events: {select: onSelect}

訪問這些事件最終將會提出這個問題的原因,一旦這個事情被排序,我正在尋找一些提示,以瞭解發生了什麼,如果我期望從mvvm太多。

編輯:

我很期待這種類型的功能,可能會在孩子電網http://jsbin.com/canomux

回答

0

看來檢索從API數據的方式是有點意外,所以用的變化:

options.success(e.data.Orders.results.toJSON()); 

options.success(e.data.Orders.results); 

的文字作品的結合。

隨着事件綁定它不工作 - 它似乎它不是做detailGrid但一般與電網,被描述 here

0

的彈出式編輯器中啓用嘗試這樣,

我只是做

<script type="text/x-kendo-template" id="child-editor-template"> 
    <input name="ShipCountry"/> 
    </script> 

http://jsbin.com/levenacari/edit?html,js,output

+0

很好,但我怎麼綁定這視圖模型...我舉的例子非常簡單,只是爲了解決這個問題,但我需要訪問viewModel以便在彈出式窗口中發生複雜的操作。隱藏一些單元格b – Turo

+0

它會自動綁定,因爲我們將數據綁定到名稱 – rJ7

+0

@Turo您能否提供一些示例來了解您的需求 – rJ7