情境: 用户可以上传excel文件。 excel中的所有标题列都以网格形式显示,并带有映射选项,以将其映射到本地数据库。
之后,用户可以选择要从excel导入的记录数。
为此,我有两个KendoUI
网格,一个用于列映射,另一个用于选择记录。
我使用dynamic ExpandoObject
对象来读取excel文件。我能够在结果中获得excel列和数据行。
public CustomDataTabel ReadExcelFile(string file)
{
var response = new ServiceResponse<BulkDataTable> { IsSuccess = false };
using (var reader = new ExcelReader(new FileInfo(file)))
{
var csvTable = reader.CreateDataTable(true);
if (csvTable != null)
{
var table = new CustomDataTabel ();
int i = 1;
foreach (System.Data.DataColumn column in csvTable.Columns)
{
table.Columns.Add(
new BulkDataColumn
{
Order = i,
ColumnTitle = column.Caption,
Key = column.ColumnName
});
i++;
}
var j = 0;
for (j = 0; j < csvTable.Rows.Count; j++)
{
dynamic rowRecord = new System.Dynamic.ExpandoObject();
var tableRow = csvTable.Rows[j];
foreach (var dataColumn in table.Columns)
{
var value = tableRow[dataColumn.Order - 1];
ImpromptuInterface.Impromptu.InvokeSet(rowRecord, dataColumn.Key, value);
}
table.DataRows.Add(rowRecord);
}
response.Data = table;
response.IsSuccess = true;
}
}
return response;
}
我能够绑定列映射网格。但对于行(数据)绑定存在问题。数据(来自excel的行)是一个带有键值数据的dynamic
对象,并且无法序列化为json,因此Kendo Grid无法绑定数据。我能够看到总数网格中的记录。
绑定Grid的逻辑如下:
var bulkDataColumn = null;
var bulkDataRow = null;
var loadColumnMapping = function (data) {
bulkDataColumn = data.BulkDataColumns;
bulkDataRow = data.BulkDataRows;// this returns dynamic rows
// Code to bind first grid i.e. Column mapping grid
// I am able to bind the first grid with column details
// Second grid (data) grid
$("#dataGrid").kendoGrid({
dataSource: {
data: bulkDataRow,
pageSize: 10,
batch: true,
schema: {
model: {
id: "Order",
fields: { // --> i don't know how to define fields, because data and fields can be different depends on the file upload by user
Key: { type: "string", editable: false },
Value: { type: "string", editable: false },
}
}
}
},
pageSize: 10,
editable: "incell",
scrollable: true,
sortable: true,
filterable: true,
edit: function (e) {
if (!e.model.IsSelected) {
//revert edited cell back to `read` mode
this.closeCell();
}
}
,
pageable: true,
columns: [
{ field: "Key", title: "Key", width: "130px" },
{ field: "Value", title: "Value", width: "130px" },
]
});
}
关于如何将dynamic
对象与kendoUI网格绑定的任何想法?
在此先感谢。