Kendo Export To PDF Unicode Support

Question

I have been trying to incorporate languages dynamically into the Kendo controls, and have run into a issue with Chinese translations which are stored as a list of Unicodes in Sql Server Database.

Translations stored in the Database

---

It didn't take long to get the Kendo Grid up and running to display these Unicodes in Chinese, through the use of the column template attribute:

template: '#= Translation #'

Kendo Grid Displaying Translations

---

The issue I am having is with the Excel/PDF exports. They do not render the Unicode values, in the same way that the Kendo Grid does through the use of the template. Instead they display default font characters:

PDF Export

CSV Export

---

I have tried the following solutions following research on the issue, to no avail:

• Setting the font family of the grid control following this recommendation; (which I don't particularly want to do as a matter of consistency with the rest of the site nor do I understand why this would work as the actual Kendo Grid itself is displaying the Chinese characters perfectly):

  .k-widget {
      font-family: 'Arial Unicode MS';
  }
  

---

• Setting the column encoded attribute to true:

  { field: "AnalyteName", title: "Analyte", attributes: { "class": "customKendoGridCell"}, width: "25%", encoded: true, template: '#= TranslationField #' },
  

---

• Using kendo.template:

  If you want to render an encoded HTML value in a template, Kendo UI templates can automatically handle the encoding.

  template: '#=setFieldName(TranslationField)#'
  
  function setFieldName(TranslationField) {
      return kendo.template("<div id='box'>#: TranslationField #</div>");
  }
  

This appears to display the entire function instead of just the field, perhaps kendo.template needs to be used differently in the context of a Kendo Grid column?

I have made a Dojo example to demonstrate the issue with the PDF export.

Answer 1

I have never come across the issue of Unicode, still, I know a solution that may help you.

.k-grid {
        font-family: "DejaVu Sans", "Arial", sans-serif;
    }

Use this line in your grid file, as in kendo, The standard PDF fonts have no support for Unicode characters.