I am trying to export the contents of my grid out to excel. One of the columns is a number but needs to be exported as a percentage (with a percent sign).
My main complaint is that the ng-template formatting is not being picked up by the export so, while the grid shows 56.75% when i export it to excel it shows 56.75.
Then I discovered that I could use the cell options feature and format the number. However, when I do this with the % it exports as 5675% not 56.75%. I can not figure out how to divide that number by 100.
Here is the grid code. I have been working on this for hours. Please help :)
<kendo-grid
#grid
class="mt-1"
[kendoGridBinding]="gridSelection ? (whoDoIOwns$ | async) : (whoOwnsMe$ | async)"
reorderable="true"
[sortable]="{ allowUnsort: true, mode: 'multiple' }"
[sort]="[
{ field: 'glNumber', dir: 'desc' },
{ field: 'legalName', dir: 'asc' }
]"
resizable="true"
>
<kendo-grid-column field="id" title="id" [hidden]="true" width="8%"></kendo-grid-column>
<!-- <kendo-grid-column title="Entity ID" field="legalEntityID" width="8%"></kendo-grid-column> -->
<kendo-grid-column
*ngIf="userAllData && !gridSelection"
title="FEIN"
field="fein"
width="10%"
></kendo-grid-column>
<kendo-grid-column
*ngIf="userAllData && gridSelection"
title="FEIN"
field="ownedFEIN"
width="10%"
></kendo-grid-column>
<kendo-grid-column
*ngIf="!gridSelection"
title="GL Number"
field="glNumber"
width="12%"
></kendo-grid-column>
<kendo-grid-column
*ngIf="gridSelection"
title="GL Number"
field="ownedGLNumber"
width="12%"
></kendo-grid-column>
<kendo-grid-column *ngIf="!gridSelection" title="Name" [field]="'legalName'" width="46%">
<ng-template kendoGridCellTemplate let-dataItem>
<a
[href]="'#/entities/' + dataItem.legalEntityID"
target="_blank"
style="color: blue; text-decoration: underline;"
>{{ dataItem.legalName }}</a
>
</ng-template>
</kendo-grid-column>
<kendo-grid-column *ngIf="gridSelection" title="Name" [field]="ownedLegalName" width="46%">
<ng-template kendoGridCellTemplate let-dataItem>
<a
[href]="'#/entities/' + dataItem.ownedLegalEntityID"
target="_blank"
style="color: blue; text-decoration: underline;"
>{{ dataItem.ownedLegalName }}</a
>
</ng-template>
</kendo-grid-column>
<kendo-grid-column title="Legal Role" field="ownershipLegalRole" width="12%"></kendo-grid-column>
<kendo-grid-column title="Acct Type" field="accountingOwnershipType" width="8%"></kendo-grid-column>
<kendo-grid-column title="Pct" field="ownershipPercentage" width="8%">
<ng-template kendoGridCellTemplate let-dataItem>
{{ dataItem.ownershipPercentage }}%
</ng-template>
</kendo-grid-column>
<kendo-grid-excel [fileName]="(gridSelection ? 'i-own-' : 'owns-me-') + 'ownership.xlsx'">
<kendo-excelexport-column
*ngIf="userAllData && !gridSelection"
field="fein"
title="FEIN"
></kendo-excelexport-column>
<kendo-excelexport-column
*ngIf="userAllData && gridSelection"
field="ownedFEIN"
title="FEIN"
></kendo-excelexport-column>
<kendo-excelexport-column
*ngIf="!gridSelection"
title="GL Number"
field="glNumber"
></kendo-excelexport-column>
<kendo-excelexport-column
*ngIf="gridSelection"
title="GL Number"
field="ownedGLNumber"
></kendo-excelexport-column>
<kendo-excelexport-column
*ngIf="!gridSelection"
title="Name"
field="legalName"
></kendo-excelexport-column>
<kendo-excelexport-column
*ngIf="gridSelection"
title="Name"
field="ownedLegalName"
></kendo-excelexport-column>
<kendo-excelexport-column
title="Legal Role"
field="ownershipLegalRole"
></kendo-excelexport-column>
<kendo-excelexport-column
title="Acct Type"
field="accountingOwnershipType"
></kendo-excelexport-column>
<kendo-excelexport-column
title="Pct"
field="ownershipPercentage"
[cellOptions]="{ format: '#.##%' }"
>
<ng-template kendoGridExcelTemplate let-dataItem>
{{ dataItem.ownershipPercentage }}%
</ng-template>
</kendo-excelexport-column>
</kendo-grid-excel>
</kendo-grid>

Hello,
We are using the MultiSelect control to show a list of options that users frequently need to select more than one of. To do this, they have to click the control, scroll and select a value from the dropdown, then click the control again, scroll and select the second value, repeat until all options have been selected.
I'm looking for an option to let them select multiple options in the MultiSelect control at the same time without having to reclick and rescroll the options every time. Is there a way to either keep the dropdown open when a selection has been made or allow a key press of say the CTRL key to allow multiple items to be selected at the same time?
I've attached a screenshot of the example MultiSelect that I am trying to pull this off on, I can include the code as well if that is needed.
Thanks,
Bryan

How do I control the animation duration in this case. What's the k-option?
<div kendo-progress-bar="progressBar" k-options="options" ng-model="progress" style="width: 100%;"> </div>

I want to Append month to year (2020) in Kendo Datepicker on left navigation pane. So the final output should be Jan-2020.
The editor Toolbar color popup/palette does not allow selecting the same color twice in a row for a different word. This happens when you select from the pop-up color palette.
Use example from website https://www.telerik.com/kendo-angular-ui-develop/components/editor/tools/
Select a word, select a color, select another word, select same color (from the popup palette). Color for 2nd word never changes.
This works correctly in the AngularJS version of the Kendo editor, but not for the Angular version of the Kendo editor.
Hello,
If you look at this example: https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/#toc-events, you will noticed that when someone click the clear all button (x) the blur event is raised.
It's possible to cancel this blur event?
It's possible to have somehow the same behavior like in the combobox case : https://www.telerik.com/kendo-angular-ui/components/dropdowns/combobox/#toc-events ?
Thanks,
Alex

Link and meta tags pasted from MS Word are missing the backslash when copy and pasted from MS Word.
Copy a link from MS Word and paste into editor, the link and meta closing tags are missing the backslash. '>'
Paste the same link into the AngularJS version and the link and meta closing tags are correct. '/>'
Hello,
I am attempting to bind the ComboBox to an array of complex objects. For this, the "keyField" and "valueField" properties are required (valuePrimitive is set to true, in case that is relevant).
This works if I do not try to bind to those properties:
<kendo-combobox valueField="myField" textField="myTextField" ... ></kendo-combobox>
However, if I try to use one-way binding:
<kendo-combobox [valueField]="myFieldBinding" [textField]="myTextBinding" ...></kendo-combobox>
I get the following error:
"Expected textField and valueField options to be set. See http://www.telerik.com/kendo-angular-ui/components/dropdowns/combobox/#toc-bind-to-arrays-of-complex-data"
I am 100% sure that actual string values are being provided for "myFieldBinding" and "myTextBinding". Further, I tested it as follows as well:
<kendo-combobox [valueField]="'hardcodedStringValueField'" [textField]="'hardcodedStringTextField'" ...></kendo-combobox>
And I get the same error.
Hi,
We have an application that has to be read in both Arabic and English which has a toggle that changes the localization between the two languages.
When the language is set to Arabic the date format changes from Gregorian to Hijri but we need the date format to always be Gregorian even when in Arabic.
Is there a way to intercept this in the localization and/or set a Gregorian format on the date tag that won't be overridden when the language changes?
Example of the date input field being used:
<input type="text" kendoTextBox class="form-control" value="{{currentContact?.dateOfBirth | date :'shortDate' }}" readonly="readonly">
