Questions on Kendo UI for Angular Forum

1 answer

35 views

Whenever Button Group is selected, unnecessary border color is appearing around the button group in Iphone 6+

I tested this issue in Android there it is working fine but when Itested it on Iphone 6, Unknown border color(cyan) is appearing around the button group which makes it so frustating. Please let me know the solution of this Issue. I have also attached the screenshot of issue for more clarification.

ButtonGroup

answered on 29 May 2020

2 answers

210 views

DatePicker highlight in Firefox

Hi, I came across a following problem with DatePicker in Firefox:

I want to highlight the date inside the DatePicker to delete it, but as soon as I let the mouse button go, only the first part of the date stays highlighted and I have to delete the date in three steps - day, month and year. In Google Chrome it works just fine - the whole date stays highlighted and therefore can be deleted at once.

Is there anything I'm missing?

Thanks, Veronika

DatePicker

answered on 29 May 2020

2 answers

63 views

Multi-select (turnoff its multi-select functionality)

https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/filtering/

For reference, please verify above link.

Please find the attached and i want the output like attached.

General Discussions

answered on 28 May 2020

7 answers

1.2K+ views

ColumnResizingService not available in TableDirective

Hello,

When I'm using a simple table, I get the following error.

ERROR Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[TableDirective -> ColumnResizingService]:

StaticInjectorError(Platform: core)[TableDirective -> ColumnResizingService]:

NullInjectorError: No provider for ColumnResizingService!

It seems that there is a TableDirective from kendo where its selector is table tag, and this directive requires ColunResizingService which can not be injected for some reason.

First of all, why kendo team wrote a directive that catches any table? That doesn't sound a good practice to me.

Second, how can I fix this issue? I want a simple table without any process on that.

Best regards,

Mojtaba

General Discussions

answered on 28 May 2020

1 answer

1.4K+ views

Remove a Column Upon Export to Excel

app.component.ts:

import { Component } from '@angular/core';

import { process } from '@progress/kendo-data-query';

import { ExcelExportData } from '@progress/kendo-angular-excel-export';

import { products } from './products';

@Component({

selector: 'my-app',

template: `

<kendo-grid [kendoGridBinding]="products" [height]="400" [pageable]="true" [pageSize]="10">

<ng-template kendoGridToolbarTemplate>

<button type="button" kendoGridExcelCommand icon="file-excel">Export to Excel</button>

</ng-template>

<kendo-grid-column field="ProductID" title="Product ID" [width]="200">

</kendo-grid-column>

<kendo-grid-column field="ProductName" title="Product Name">

</kendo-grid-column>

<kendo-grid-column field="Category.CategoryName" title="Category">

</kendo-grid-column>

<kendo-grid-excel fileName="Products.xlsx" [fetchData]="allData"></kendo-grid-excel>

</kendo-grid>

`

})

export class AppComponent {

public products: any[] = products;

public group: any[] = [{

field: 'Category.CategoryName'

}];

// Bind 'this' explicitly to capture the execution context of the component.

constructor() {

this.allData = this.allData.bind(this);

}

public allData(): ExcelExportData {

const result: ExcelExportData = {

data: process(products, { group: this.group, sort: [{ field: 'ProductID', dir: 'asc' }] }).data,

group: this.group

};

return result;

}

Given the code above, how can I remove a column (Product ID, Product Name or Category) upon exporting it to excel?

General Discussions

answered on 28 May 2020

2 answers

640 views

Grid state persistence

Hello

I thought I would share my github project that I put together help implement grid state consistently in my applications.

The project consists of an Angular Library and example of the implementation. The library can also be installed via NpmJS.

Hopefully you can find this useful?

Github: https://github.com/lucasheight/angular-kendo-grid-state

NpmJs: https://www.npmjs.com/package/@lucasheight/kendo-grid-state

StackBlitz: https://stackblitz.com/edit/angular-kendo-grid-state

kind regards

Lynden

Grid

answered on 27 May 2020

4 answers

3.3K+ views

Insert HTML content to Editor

There is no insertHTML command for Angular Kendo Editor.

I tried InsertText, however, it will show all html tag in editor. How to resolve this issue?

Please see code below:

var strResult =  "<p></p>"
    +"<span style='font-weight:bold'>CBC, Manual Diff if Indicated (2020-03-17 13:30:00.000)</span>"
   +"<p></p>"
    +"      [MCH]"
     +" 27.1 N 27.0-32.0 "
    +"<p></p>"
    +"      ["
    +"Platelet Count"
    +"]"
     +"  290 N 150-450";

editor.exec('insertText', { text: strResult});

Editor

answered on 27 May 2020

2 answers

8.4K+ views

[Kendo Angular Grid] - How to get currently selected rows?

Hi,

I am trying to get currently selected rows from a kendo angular grid and perform some operations for selected rows (such as call an external API using information from selected rows).

- user can select one row

- user can select multiple rows using `shift`

- user can select multiple sections using combination of `shift` and `ctrl`

I tried to use `selectionChange` which knows only the current selected rows and not previously selected.Tried to follow this: https://www.telerik.com/forums/how-to-get-the-selected-row-data-item which did not work either.

Please provide a sample get list of selected rows at will from the grid. It is fine even if I can get `id` column for selected rows as I can filter through the original data and get other columns for selected ids.

General Discussions

answered on 27 May 2020

1 answer

150 views

HOW TO ADD TABLE WIZARD IN EDITOR LIKE JQUERY UI

hi, i want to add table in editor. but i cannot edit width and height. how to display table wizzard like jquery have ?

Editor

answered on 27 May 2020

1 answer

117 views

Extend the existing Upload ng-template

I would like to customise the Template using the technique described in the API reference, and similar to one of the other threads in this forum. I have used this example posted by an admin to another thread: https://stackblitz.com/edit/angular-gmuolt-jxzifm?file=app/upload.component.ts

However, I find that when you add an ng-template, all of the default template, including default nice UX is removed.

Is it possible to instead customise the existing Template, for example by adding a second"row" or "li".

If not, how would I go about recreating the UX elements from the default template to use in my custom template?

Thanks.

Upload