This is a migrated thread and some comments may be shown as answers.

how to encode ampersand in row caption

1 Answer 382 Views
PivotGrid
This is a migrated thread and some comments may be shown as answers.
Anne Marie
Top achievements
Rank 1
Anne Marie asked on 28 Jun 2017, 02:00 PM

Hi,

I have found a problem when having text with ampersand in the data used for a pivot grid when expanding the row or column with that ampersand in the caption.  A JavaScript exception is caused in the browser (Chrome & IE).  The exception is "Uncaught TypeError: Cannot read property 'value' of undefined at init._buildRow" in kendo.all.js:73938.  The undefined object is dataItem.

I have encoded the ampersand using & within the string at the datasource and whilst that is displayed correctly I believe the & within the encoded & is still causing the exception.  I have tried using the rowHeaderTemplate and the row encoded property but neither seem to stop the error from occurring.  Is there another way I should be encoding this text so that it doesn't break the JavaScript code?

My original project is Kendo UI for MVC but I have created a dojo using the JavaScript version to re-create the problem.

dojo.telerik.com/@amdenley/OkEqIV/2

1 Answer, 1 is accepted

Sort by
0
Accepted
Alex Hajigeorgieva
Telerik team
answered on 30 Jun 2017, 02:18 PM
Hello Anne Marie,

Thank you very much for the provided Dojo to illustrate your case.

The observed behaviour is expected because the member captions are used for the creation of the paths which are going to be expanded. Despite the fact that this is expected, I believe that it is not desired and would like to investigate if there is anything we can do about it. Therefore, I have logged this as an issue and you may follow its progress at:

https://github.com/telerik/kendo-ui-core/issues/3367

If possible, as a workaround, you should keep the member captions 'ampersand-free' and use the rowHeaderTemplate to replace them with an ampersand so they look as desired:

rowHeaderTemplate: function(e){
 if(e.member.caption.indexOf(" and ") > 0){
  return e.member.caption.replace("and", "&");
 } else {
  return e.member.caption;
 }
},

For your convenience, here is the modified Dojo:

http://dojo.telerik.com/UZASo

As a token of appreciation, I have also updated your Telerik points. Thank you very much for identifying this issue.

Regards,
Alex Hajigeorgieva
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
Tags
PivotGrid
Asked by
Anne Marie
Top achievements
Rank 1
Answers by
Alex Hajigeorgieva
Telerik team
Share this question
or