Question

我有一个带有复选框的kogrid。我有两个问题：

当我选中/取消选中复选框时，我需要提取行值。如何获取行数据？
我在kogrid外面有一个保存按钮。如果单击“保存”，则行值应作为json对象发布。

HTML：

<div id="reconciliationGrid" data-bind="koGrid: reconciliationGridOptions"></div>

JS：

this.currentRowValues = ko.observableArray(); 
self.reconciliationGridOptions = { 
                      data: self.reconciliationGrid, 
                      canSelectRows: true, 
                      afterSelectionChange: function () { return true; }, 
                      selecteditems: this.currentRowValues 
                };

Answer 1

您的代码中的错误可能在selecteditems，但正确的是selectedItems，请参阅代码段，其中包含记录当前所选行的示例，显示在div中选择的所有内容以及单击保存按钮显示所有选定数据的警报。

＆＃13;

function viewModel(){
  this.currentRowValues = ko.observableArray([]); 
   this.gridData = ko.observableArray([{name: "Moroni", age: 50},
                                      {name: "Tiancum", age: 43},
                                      {name: "Jacob", age: 27},
                                      {name: "Nephi", age: 29},
                                      {name: "Enos", age: 34}]);
  
  this.reconciliationGridOptions = { 
                      data: this.gridData, 
                      selectedItems: this.currentRowValues ,
                      afterSelectionChange: function (selectedRow) { 
                        console.log(selectedRow);
                        return true;
                      }, 
                };  
};
viewModel.prototype.save = function(){
   alert(ko.toJSON(this.currentRowValues()));
};

ko.applyBindings(new viewModel());

＆＃13;

.gridStyle {
    border: 1px solid rgb(212,212,212);
    width: 400px; 
    height: 300px;
 
}

button{
  padding: 10px;
  margin: 10px 0 10px 0;
}

.selectedItems{
    border: solid black 1px;
    padding: 10px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<link href="https://cdn.lukej.me/kogrid/2.0.6/KoGrid.css" rel="stylesheet"/>
<script src="https://cdn.lukej.me/kogrid/2.0.6/koGrid.debug.js"></script>



<div class="gridStyle" id="reconciliationGrid" data-bind="koGrid: reconciliationGridOptions"></div> 

<button data-bind="click: save">Save Example</button>
<br/>
<div class="selectedItems" data-bind="foreach: currentRowValues">
       <span data-bind="text:ko.toJSON($data)"></span>
</div>

＆＃13;

单击kogrid中的复选框时获取行数据

1 个答案: