文章/答案/技术大牛

发布

问如何访问网格行
EN

Stack Overflow用户

提问于 2012-12-16 15:48:32

回答 1查看 855关注 0票数 1

我试图用kendoui建立javascript可编辑网格，我想编辑弹出窗口，将只编辑javascript数据(无服务器)弹出窗口必须后，用户点击“编辑”按钮在每一行，在弹出窗口上，我想要显示与选定的用户的姓氏和名字输入。我的问题是:我如何访问row的数据绑定数据(因为据我所知没有$data变量)？

这是我的HMTL

<!DOCTYPE html>
<html>
<head>
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js"></script>


  <script src="https://raw.github.com/rniemeyer/knockout-kendo/master/build/knockout-kendo.min.js"></script>  
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div data-bind="kendoGrid: {data:users, sortable:true, columns:[
{ field: 'firstname', width: '100px' },
{ field: 'lastname', width: '100px' },
{ field: 'lastname', width: '100px' },
{ template: '<button>edit</button>', title: ''}
]}"> </div>
</body>
</html>

这里是JS：

var userVM=function(nm,lnm){
var self=this;  

  this.firstname= ko.observable(nm);
  this.lastname= ko.observable(lnm);
  this.EditUser=function(u){


    selectedUser(u);
    $("#dialog").dialog();
  };


};
var users=ko.observableArray([new userVM('Shimon','Rapaport'),new userVM('Ahmed','ElChalil')]) ;

var selectedUser=ko.observable();



ko.applyBindings();

这是工作演示(没有编辑弹出窗口) http://jsbin.com/iwevek/1/edit

这是我在没有kendoui的情况下做同样的事情的演示，非常简单的http://jsbin.com/epocov/9/edit

knockout.js

kendo-ui

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-12-17 22:03:33

我目前正在添加在网格(和列表视图)小部件中呈现Knockout模板的功能。这将允许您针对视图模型项编写正常的KO绑定。

如果没有这种支持，您需要一种从按钮转到视图模型数据的方法。下面是一个示例，其中用户有id，id是按钮(data-id)的一部分，我使用$.on附加一个委托处理程序。

在那里，您可以使用该id查找适当的用户，并相应地更新您的selectedUser可观察值。

$(".k-grid").on("click", ".editBtn",function() {
  var id = this.getAttribute("data-id"),
      match = ko.utils.arrayFirst(users(), function(user) {
          return user.id === id;
      });

  selectedUser(match);
});

http://jsbin.com/ixewud/2/edit

一旦你更新了selectedUser，你就可以使用你的模式弹出窗口或者任何你想要编辑的东西了。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/13899520

复制

相似问题

问如何访问网格行
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何访问网格行EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何访问网格行
EN