Question

这是方案

我想在kendo网格中显示数据，在选择该网格上的行时，它应该在带有文本框的表单中显示该行的详细信息。用户将能够更新值，它应该反映在kendo Grid中。我正在使用knockout-kendo.js。

这是jsfiddle链接 - http://jsfiddle.net/saisworld/u7YnY/

能够显示数据并将其绑定到grid.But单击网格中的行。它没有反映在表格中。不确定缺少什么。请指教。
我还想用Kendo UI mvc包装器来测试相同的场景，以显示网格（而不是像上面的例子一样使用声明性的初始化）和Knockout-kendo.js框架，看看它们是否可以组合在一起。

这里能够将数据绑定到网格，然后能够使用knockout-kendo或者只是淘汰来从网格获取数据并以表格形式显示但是它没有更新回网格。

<p class="k-block k-header k-shadow"> Kendo Grid - Companies</p>
@(Html.Kendo().Grid(Model)
        .Name("somegrid")
        .DataSource(ds => ds.Ajax().PageSize(10).ServerOperation(false))
        .Columns(c =>
        {
            c.Bound(p => p.CompanyName).Width(2);
            c.Bound(p => p.FullAddress).Width(2);
        })
        .Selectable(s => s.Mode(GridSelectionMode.Single))
        .Events(e=>e.Change("onChange"))
        .Pageable()
        .Sortable()
        .Filterable()
  )

<form class="kCompaniesClass k-block k-info-colored">
<div class="k-header k-shadow">Company Details - using Kendo MVVM</div>
<table>
    <tr>
        <th>Company Name</th>
        <th>Address</th>
    </tr>
    <tr>
        <td>
            @Html.TextBox("CompanyName",null,new Dictionary<string, object>{{"data-bind","value: CompanyName"}})
        </td>
        <td>
            @Html.TextBox("Fulladdress",null,new Dictionary<string, object>{{"data-bind","value: FullAddress"}})
        </td>
    </tr>
</table>

</form>


 <script type="text/javascript">
   var viewModel = {
    CompanyName: ko.observable(""),
    FullAddress: ko.observable("")
 };


function onChange(e) {
    grid = e.sender;
    var koCompanyItem = grid.dataItem(this.select());
    viewModel = koCompanyItem;
   /* ko.cleanNode(document.getElementById("somegrid"));
    ko.applyBindings(viewModel, document.getElementById("somegrid"));*/
    ko.applyBindings(viewModel);
}

Knockout-kendo和Kendo UI MVC包装器

0 个答案: