New to Kendo UI for jQuery? Download free 30-day trial

Show Multiple Spaces in Grid Cells


Product Progress® Kendo UI® Grid for jQuery
Product Version Created with version 2017.3.1026


When I enter a value with multiple spaces in the Grid, how can I display all spaces and avoid trimming the spaces down to a single space?


The skipping of all spaces but one is due to the default HTML behavior—in HTML, additional spaces are trimmed. To display the text as is, specify a template for the Grid cell which will display the value in a pre element.

<div id="grid"></div>

    $(document).ready(function () {
        var dataSource = new{
            data: [
                { "TextField": "Text     with     multiple    spaces" }

            dataSource: dataSource,
            height: 550,
            columns: [
                { field: "TextField", template: "<pre>#=TextField#</pre>" }
            editable: true

In this article