gpt4 book ai didi

javascript - 如何在剑道网格中手动设置列值

转载 作者:行者123 更新时间:2023-12-03 18:09:53 25 4
gpt4 key购买 nike

我能够在控制台上设置备注,但我不知道用户保存更改后如何将备注值设置到网格中。

无论如何手动将值设置为剑道网格?

示例输出

         |Remark         |User Name|Phone Number|Country
[unable]|username length|ad |0123456789 |UK
[enable]| |admin2 |0123456222 |US
[enable]| |admin3 |0123333339 |CN

用户编辑表格后 - 输出
         |Remark         |User Name|Phone Number|Country
[enable]| |admin1 |0123456789 |UK
[enable]| |admin2 |0123456222 |US
[enable]| |admin3 |0123333339 |CN

代码片段中提供了项目示例。

var defaultData = [{
reason: "",
userName: "ad",
phoneNumber: "0123456789",
country: "UK"
}, {
reason: "",
userName: "admin2",
phoneNumber: "0123456222",
country: "US"
}, {
reason: "",
userName: "admin3",
phoneNumber: "0123333339",
country: "CN"
}];
var defaultColumns = [{
field: "",
width: "40px",
template: "<input name='Discontinued' id='remarkCheckBox' class='checkbox' #= (reason.length > 0)? 'disabled=disabled' : ''# type='checkbox' />"
}, {
field: "reason",
title: "Remark",
attributes: {
style: "color:\\#cc0000"
}
}, {
field: "userName",
title: "User Name"
}, {
field: "phoneNumber",
title: "Phone Number"
}, {
field: "country",
title: "Country"
}];



var viewModel = kendo.observable({
onClick: function() {
loadImportGrid(defaultData, defaultColumns);
},

});

function loadImportGrid(defaultData, defaultColumns) {
var grid = $("#grid").kendoGrid({
columns: defaultColumns,

dataSource: {
data: defaultData
},
dataBound: function() {
grid = $("#grid").data("kendoGrid");
grid.saveChanges();
},
saveChanges: function() {
getRemark();
},
toolbar: ["save"],
selectable: "row",
scrollable: true,
sortable: true,
editable: true
});

}

function validation(objectList) {
if (!objectList.userName || objectList.userName.length < 4) {
invalidRecordFormat = "username length";
return invalidRecordFormat;
}

if (!objectList.country || objectList.country === " ") {
invalidRecordFormat = "country invalid";
return invalidRecordFormat;
}
invalidRecordFormat = "";
return invalidRecordFormat;
}


function getRemark() {
var data = $("#grid").data("kendoGrid").dataSource._data;
for (var i = 0; i < data.length; i++) {
console.log(validation(data[i]));
}
}
kendo.bind($("#importFile"), viewModel);
html * {
font-size: small;
font-family: Arial !important;
}
.uploadLabel {
color: white;
background-color: #008efe;
border-style: solid;
border-width: 1px 1px 1px 1px;
width: 100px;
height: 30px;
text-align: center;
border-radius: 3px;
display: block;
line-height: 250%;
}
#importUserFile {
opacity: 0;
position: absolute;
z-index: -1;
}
<!DOCTYPE html>
<html>

<head>
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.common-bootstrap.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.bootstrap.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.bootstrap.mobile.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js"></script>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>

<body>
<div id="importFile">
<label class="uploadLabel" for="importUserFile">Browse</label>
<input name="file" id="importUserFile" data-bind="events:{click:onClick}" />
</div>
<div id="grid"></div>
</body>

</html>

最佳答案

始终使用 set() 模型中的方法来更改值。无需refresh() ,例如:

var dataItem = $("#grid").data("kendoGrid").dataSource.data()[0];
dataItem.set("reason", "new value");
Demo

关于javascript - 如何在剑道网格中手动设置列值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41439122/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com