Declined
Last Updated: 12 Oct 2021 08:05 by ADMIN
Andrii
Created on: 05 Oct 2021 14:42
Category: Grid
Type: Bug Report
0
Wrong Grid title generation if grid is grupable

Create grid as groupable and try to set column title as "<span class='glyphicon glyphicon-cloud'></span>"


$("#grid").kendoGrid({
  groupable: true,
  columns: [{
    field: "name",
    title: "<span class='glyphicon glyphicon-cloud'></span>"
    //, groupable: false
  }, {
    field: "age",
    title: "Age"
  }]  
});

Expected result - column title as glyphicon glyphicon-cloud but actual is wrong

To fix the problem - set up column as groupable: false (just uncomment) and title will be ok

But if I want to use such title and groupable: true - I cannot

Full example:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.3.914/styles/kendo.default-v2.min.css"/>

    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2021.3.914/js/kendo.all.min.js"></script>
  <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

</head>
<body>
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  groupable: true,
  columns: [{
    field: "name",
    title: "<span class='glyphicon glyphicon-cloud'></span>"
    //, groupable: false
  }, {
    field: "age",
    title: "Age"
  }]  
});
</script>
</body>

 

and on dojo: https://dojo.telerik.com/EWUnarUf/2

  
1 comment
ADMIN
Martin
Posted on: 12 Oct 2021 08:05

Hello, Andrii,

Please use the columns.headerTemplate configuration instead. Here is the modified example for reference.

Regards,
Martin
Progress Telerik

Remote troubleshooting is now easier with Telerik Fiddler Jam. Get the full context to end-users' issues in just three steps! Start your trial here - https://www.telerik.com/fiddler-jam.