2016-11-07 116 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