Question

您好我在jquery中使用以下代码创建了一个Kendo Grid：

Kendo Grid：

$('#divFolderNotes').kendoGrid({
        dataSource: data
        batch: true,
        columns: [
               { field: "Text", title: "Note Text" },
               { field: "CreatedByDisplayName", width: '190px', title: "Created By" },
               { field: "CreatedDateTime", width: '190px', title: "Created Datetime" },
                 ],
        scrollable: true,
        sortable: true,
        reorderable: true,
        resizable: true,
        height: 250,
        selectable: "row",
        autoSync: true,
        editable: true,// "inline",
        navigatable: true,
        columnMenu: true,
        pageable: {
            refresh: true,
            pageSizes: true,
            buttonCount: 5
        },
    })

问题：

第一栏注释文字将包含将包含HTML格式数据的值。

以下是一个更好的想法：

现在数据显示为：

First Name : Nitin <br/> Second Name : Rawat

但我希望数据显示为：

First Name : Nitin
Second Name : Rawat

另外，Note Text列将通过内联编辑进行编辑，因此在编辑模式下我也希望数据显示为：

First Name : Nitin
Second Name : Rawat

任何帮助都将受到高度赞赏。

Answer 1

将列的encoded属性设置为false以禁用自动HTML编码。

来自doc page：

如果设置为true，则列值将在之前进行HTML编码显示。如果设置为false，则列值将按原样显示。默认情况下，列值是HTML编码的。

更改了代码：

$('#divFolderNotes').kendoGrid({
        dataSource: data
        batch: true,
        columns: [
               { field: "Text", title: "Note Text", encoded: false },  #<------ Edit Here
               { field: "CreatedByDisplayName", width: '190px', title: "Created By" },
               { field: "CreatedDateTime", width: '190px', title: "Created Datetime" },
                 ],
        scrollable: true,
        sortable: true,
        reorderable: true,
        resizable: true,
        height: 250,
        selectable: "row",
        autoSync: true,
        editable: true,// "inline",
        navigatable: true,
        columnMenu: true,
        pageable: {
            refresh: true,
            pageSizes: true,
            buttonCount: 5
        },
    })

编辑：由于在编辑时应保留换行符，您可能应该用换行符替换<br />标记。这样它将在表单字段中显示为实际的换行符。以下是一个示例：jQuery javascript regex Replace <br> with \n

当用户最初提交数据时，最好这样做，但是，如果这不是一个选项，您可以在显示数据时将其替换为JS。

Answer 2

您可以尝试使用kendo模板。

这些请尝试以下链接

http://docs.telerik.com/kendo-ui/api/web/grid#configuration-columns.template

http://docs.telerik.com/kendo-ui/api/web/grid

希望这会有所帮助。

Kendo网格列中的格式化HTML数据

2 个答案: