如何冻结剑道电子表格中的第一行。我有一个使用 Ajax json 绑定的剑道电子表格。我正在尝试冻结第一行以冻结标题行。我已经用谷歌搜索了很多，但没有得到任何解决方案。请帮我。
这是我下面的剑道电子表格代码。
<script>
$(function () {
debugger
var customVal = $('#subtab-agent-home-unpaid').find('span.badge ').text();
var CellCount = $('#sessionDivCount').attr('data-id');
var headercount = '1';
var displayCount = Number(CellCount) + Number(headercount);
var shouldPopulateHeader = '';
var dataSource = new kendo.data.DataSource({
transport: {
read: onRead,
submit: onSubmit
},
requestEnd: function (e) {
setTimeout(function (e) {
debugger
if (shouldPopulateHeader) {
shouldPopulateHeader = false;
var spreadsheet = $("#spreadsheet").data("kendoSpreadsheet");
var sheet = spreadsheet.activeSheet();
// Change the default headers for the first and the second column
sheet.batch(function () {
sheet.range("A1").value("Order ID");
sheet.range("A1").addClass("customHeaderRowStyles");
sheet.range("B1").value("PO Number");
sheet.range("C1").value("Method");
sheet.range("D1").value("Check/Receipt/Reference/Confirmation Number");
sheet.range("E1").value("Date Check Was Made Made Payment Was Made");
sheet.range("F1").value("Agent Payment Confirmation");
sheet.range("G1").value("Estimated Payment Arrival Date");
sheet.range("A1:A16384 ").enable(false);
sheet.range("B1:B16384 ").enable(false);
sheet.range("A2:A16384 ").textAlign = "center";
var range = sheet.range("A2:A16384"); // 2x2 cell range
range.bold = true;
range.textAlign = "center";
range.color("green");
var range1 = sheet.range("B2:B16384"); // 2x2 cell range
range1.bold = true;
range1
range1.textAlign = "center";
range1.color("black");
range1.defaultValue = null;
sheet.range("c2").textAlign = "center";
}, { recalc: true });
}
}, 0);
},
batch: true,
change: function () {
$("#cancel, #save").toggleClass("k-state-disabled", !this.hasChanges());
},
schema: {
model: {
//id: "ProductID",
fields: {
OrderID: {
type: "number",
defaultValue: null
},
PO: {
type: "string",
defaultValue: null
},
Method: {
type: "string",
},
Check_Receipt_Refernce_confirmation_Number: {
type: "string"
},
DateCheck_Was_Mailed_Payment_Was_Made: {
type: "date"
},
Agent_Payment_Confirmation: {
type: "string"
},
Estimated_Payment_Arrival_Date: {
type: "date"
},
}
}
}
});
$("#spreadsheet").kendoSpreadsheet({
columns: 8,
rows: displayCount,
toolbar: true,
sheetsbar: false,
sheets: [{
name: "Products",
dataSource: dataSource,
filter: {
ref: "A1:G"+Number(CellCount)+"",
columns:[]
},
rows: [{
height: 20,
cells: [
{
value: "Order ID",
bold: "true",
background: "#9c27b0",
textAlign: "center",
color: "white",
hidden: true,
enable: false
}, {
bold: "true",
background: "#9c27b0",
textAlign: "center",
color: "white",
enable: false
}, {
bold: "true",
background: "#9c27b0",
textAlign: "center",
color: "white",
}, {
bold: "true",
background: "#9c27b0",
textAlign: "center",
color: "white",
},
{
bold: "true",
background: "#9c27b0",
color: "white",
textAlign: "center",
},
{
bold: "true",
background: "#9c27b0",
textAlign: "center",
color: "white"
}, {
bold: "true",
background: "#9c27b0",
textAlign: "center",
color: "white"
}
]
}],
columns: [
{ width: 145 },
{ width: 145 },
{ width: 145 },
{ width: 300 },
{ width: 300 },
{ width: 300 },
{ width: 300 }
]
}]
});
function onSubmit(e) {
debugger
var arrofId = new Array();
var models = {};
var obj = "";
for (i = 0; i < JSON.stringify(e.data.created.length); i++) {
obj = e.data.created[i];
arrofId.push(obj);
}
arrofId.push(obj);
$.ajax({
type: "POST",
url: "../Agent/GetDataSpreadSheetSubmit",
data: '{models: ' + JSON.stringify(arrofId) + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
alert('Record Saved Succesfully');
$('#grid').data('kendoGrid').dataSource.read();
$('#grid').data('kendoGrid').refresh();
},
error: function (xhr, httpStatusMessage, customErrorMessage) {
alert(xhr.responseText);
}
});
}
function onRead(options) {
$.ajax({
url: "../Agent/GetDataSpreadSheet",
dataType: "json",
success: function (result) {
debugger
options.success(result.data);
$("#spreadsheet").data("kendoSpreadsheet").refresh();
var spreadsheet = $("#spreadsheet").data("kendoSpreadsheet");
var sheet = spreadsheet.activeSheet();
sheet.range("A1").value("Order ID");
sheet.range("B1").value("PO Number");
sheet.range("C1").value("Method");
sheet.range("D1").value("Check/Receipt/Reference/Confirmation Number");
sheet.range("E1").value("Date Check Was Mailed Payment Was Made");
sheet.range("F1").value("Agent Payment Confirmation");
sheet.range("G1").value("Estimated Payment Arrival Date");
sheet.range("A1:A16384 ").enable(false);
sheet.range("A1:A16384 ").textAlign("center");
sheet.range("B1:B16384 ").enable(false);
sheet.range("B1:B16384 ").textAlign("center");
sheet.range("C1:C16384 ").textAlign("center");
sheet.range("D1:D16384 ").textAlign("center");
sheet.range("E1:E16384 ").textAlign("center");
sheet.range("F1:F16384 ").textAlign("center");
sheet.range("G1:G16384 ").textAlign("center");
sheet.range("A2:A16384 ").textAlign = "center";
var range = sheet.range("A2:A16384"); // 2x2 cell range
range.bold = true;
range.textAlign = "center";
range.color("black");
var range1 = sheet.range("B2:B16384"); // 2x2 cell range
range1.bold = true;
range1.textAlign = "center";
range1.color("black");
range1.defaultValue = null;
sheet.range("c2").textAlign = "center";
},
error: function (result) {
options.error(result);
}
});
}
$("#save").click(function () {
if (!$(this).hasClass("k-state-disabled")) {
dataSource.sync();
}
});
$("#cancel").click(function () {
if (!$(this).hasClass("k-state-disabled")) {
dataSource.cancelChanges();
}
});
$("#btncloseSpreadheet").click(function () {
$('#ExportExcelModel').toggle();
});
});
</script>
请建议我如何冻结第一个标题。我没有得到任何解决方案。请帮我。