如何使用jqxDataTable反转或转置表？

Question

我在项目中使用jqxDataTable作为动态表。对于某些单元格，我们将获得百分比符号和文本。当％存在时，jqxDataTable插件意外行为。 PFB的一些示例场景。

实际数据

1. Apple，增加值（MRP的百分比）
2. 藏在书包里的书（每包10-12本书的百分比）
3. 猫饮20％牛奶

显示数据

1. 0
2. 藏在书包里的书（每包10-12本书的百分比）
3. 20

如果有人为这个问题找到任何解决方案，请告诉我。

更新

在分析问题时，我们认为问题可能是因为在初始化jqxDataTable时提供了列映射。

我们正在以JSON格式从Web服务获取数据，我们正在将JSON转换为HTML，然后再加载到jqxDataTable。这样做是为了使用户能够以倒置的方式查看表。即，用户可以切换表以将列视为行，反之亦然。

请使用jqxDataTable的内置功能建议任何反转表格视图的替代方法。

function buildDataTableTranspose2(dimension, dataSource, dataFields, fromload) {
var gridfieldname = gbl_metadata.GridDataFields[dimension][0]["name"];
var gridfieldcaption = gbl_metadata.ColumnNames[dimension][0]["columnName"];
var dataAdapterMetadata = new $.jqx.dataAdapter(dataSource, {
    loadComplete: function (records) {
        var dataTableColumns = new Array();
        var columnArray = new Array();
        columnArray = "[{ text: \'" + gridfieldcaption + "\',dataField:\'" + gridfieldcaption + "\', width: 300, pinned: true },";
        var header = "<thead><tr><th>" + dataFields[0]['text'] + "</th>";
        var column = "";
        for (var k = 0; k < records.length; k++) {
            if (k == 0) column = "{" + "text:\'" + escapeEx(records[k][gridfieldname]) + "\'," + "dataField:\'" + escapeEx(records[k][gridfieldname] + k) + "\'," + "width:300, columntype:\'custom\', cellsrenderer: cellsrenderer, rendered: rendered, createeditor: createeditor, initeditor: initeditor }";
            else column = ",{" + "text:\'" + escapeEx(records[k][gridfieldname]) + "\'," + "dataField:\'" + escapeEx(records[k][gridfieldname] + k) + "\'," + "width:300, columntype:\'custom\', cellsrenderer: cellsrenderer, rendered: rendered, createeditor: createeditor, initeditor: initeditor }";
            columnArray = columnArray + column;
            header = header + "<th>" + records[k][gridfieldname] + k + "</th>";
        }
        columnArray = columnArray + "]";
        Array(columnArray);
        columnArray = eval(columnArray);
        header = header + "</tr></thead>";
        var table = "<tbody>";
        for (i = 1; i < dataFields.length; i++) {
            var row = "<tr><td>" + dataFields[i]['text'] + "</td>";
            for (j = 0; j < records.length; j++) {
                var dataValue = records[j][dataFields[i]['dataField']];
                row = row + "<td>" + escapeEx(dataValue == null ? "" : dataValue) + "</td>";
            }
            table = table + row + "</tr>";
        }
        table = table + "</tbody>";
        table = "<table id='" + dimension + "_metadata_transposetable'>" + header + table + "</table>";
        $('#' + dimension + '_metadataTable').html(table);
        $('#' + dimension + '_metadataTable table').jqxDataTable({
            sortable: true,
            width: '100%',
            height: getGridHeight(),
            filterable: false,
            columnsReorder: true,
            columnsResize: true,
            columns: columnArray
        });
    }
});
// perform data binding.
dataAdapterMetadata.dataBind();
}

Answer 1

我设法通过在绑定到jqxDataTable之前转置JSON来解决这个问题。