When using any kendo components that uses dialogs from inside an ionic application, all dialogs experience stacking context issues in iOS.
The solution for this at the moment is to tell every single component to append its dialog(s) to a specified container in a bid to better control its visibility.
Right now, not every component have an 'appendTo' setting for its dialogs (ie: Editor) which makes it unusable on iOS devices.
The feature I would like to request is a way to setup the default 'appendTo' container only once from a core service to any and all dialogs.
This would help in not having to add it manually to every single components we use and maybe make it easier for you to make this feature available to more components with less work. I would make it so it applies to the dialog component and service. (or use different methods to setup each differently)
Here's how it could look like :
@Component({
selector: 'app-mycomponent',
templateUrl: './mycomponent.component.html'
})
export class MyComponent implements OnInit {
public kendoContainer: ViewContainerRef; //This would point to a container.
constructor( private kendoSetupService: SetupService ) {}
ngOnInit() {
//This would affect all components using dialogs as well.
this.kendoSetupService.dialogs.setDefaults({
'appendTo': this.kendoContainer
});
}
}
<kendo-dropdownlist [(ngModel)]="data" [popupSettings]="{ 'appendTo': kendoContainer }"></kendo-dropdownlist>This service could be used to override many of the kendo default behaviors with minimal code footprint in the end.
It could be divided into smaller default services instead if you prefer such as DialogSetupService
I have made some predefined html and load to kendo editor for angular. Table html styles are overwritten by k-table styles and all styles are gone.Is there any possibility to adjust width , border style of table in kendo editor for angular?
I have found table wizard for insert table for kendo editor in JQuery. Is there possibility to add this feature for angular kendo editor?
Hi,
The example at the following URL is broken. See the attached screenshot for more details. Kindly fix asap. Thanks.
Regards,
Al
Please ensure that ALL kendo components are extended with @Output() onDataBound = new EventEmitter<any|T>();
Hi,
We are in need of a lightweight timeline component. One that shows events grouped by date and/or time with the options to expend all the event if there are more then one on the same date.
A neat feature would be an action button on an event. This would greatly enhance the experience of the timeline.
We suggest something similar to this one: Clarity Design System - Documentation - Timeline
Our use case:
We have price lists that are published on x date and time.
To track a collection of price lists and events per price list chronologically, we need a timeline with (optional) actions per published event.
Kind regards,
Maikel
There seems to be a styling bug in the Kendo theme for Bootstrap.
Default Bootstrap buttons has this strange shadow or border issue
I very recently tried to update kendo UI to the latest version (from kendo-default-theme 4.23.0 to latest), and ran into a lot of problems, caused by the fact that I don't use the precompiled css theme styles. (removing the "node_modules/@progress/kendo-theme-default/dist/all.css" from the styles array in angular.json)
It is very opaque which styles needs to be imported for which module, and in what order they to be imported, since that seems to matter too.
Especially because there are no documentation for this at all.
For example, to get the styles for the new kendo-textbox component, the following needs to be imported in the styles.scss, AND in that specific order.
button needs to be first, and forms has to be before textbox and input
@import '~@progress/kendo-theme-default/scss/button/_index.scss';
@import '~@progress/kendo-theme-default/scss/forms/_index.scss';
@import '~@progress/kendo-theme-default/scss/textbox/_index.scss';
@import '~@progress/kendo-theme-default/scss/input/_index.scss';which means that none of the following will compile:
@import '~@progress/kendo-theme-default/scss/forms/_index.scss';
@import '~@progress/kendo-theme-default/scss/button/_index.scss';
@import '~@progress/kendo-theme-default/scss/input/_index.scss';
@import '~@progress/kendo-theme-default/scss/textbox/_index.scss';@import '~@progress/kendo-theme-default/scss/button/_index.scss';
@import '~@progress/kendo-theme-default/scss/input/_index.scss';
@import '~@progress/kendo-theme-default/scss/forms/_index.scss';
@import '~@progress/kendo-theme-default/scss/textbox/_index.scss';
As i see it there are two reasonable ways to solve this, where the first obviously results in the best user experience:
Hi,
Currently the kendo-datepicker submits the form when you press the enter key in the calendar popup.
I don't think this is the purpose? Can this be prevented please? If the current behaviour is useful in some scenarios, maybe provide a configuration option to alter this.
Thank you in advance.
Best regards,
Johan
https://stackblitz.com/edit/angular-niog8n-eldomz?file=app%2Fapp.component.ts
How to reproduce:
1.- Make a grid with master detail
2.- In master detail make a grid
3.- Create a context menu with options for the grid with a method so that when you click an option from the context menu it does something (console.log('Hello') for example)
4.- Create a context menu with options for the subgrid with another method so that when you click an option from the context menu it does something different (console.log('Goodbye') for example)
5.- When you click on an option from the context menu of the subgrid it will not call its function (console.log ('Goodbye')), it will call the function that triggers the context menu of the grid that contains the subgrid (console.log('Hello')
Even if a function is not set in the context menu of the subgrid it calls the function from the top context menu.
I solved it using 1 function for all context menus, but it doesn't seem like the best way to me
If ComboBox is used in a form and its required, screen readers will not pick up this information since it is not passed on to the underlying input field.
The example a nice workaround, but a final solution should have this automatically implemented by the control.
https://stackblitz.com/edit/angular-2ck3gu
In the Kendo ComboBox, the selection part is not working with shadow dom.
1. Reproduction:
Please look at the below links,
With ShadowDOM:
https://stackblitz.com/edit/angular-evkasb?file=app%2Fapp.component.ts
Without ShadowDOM:
An example is provided in the below link under 'ENABLING SUGGESTION' section
https://www.telerik.com/kendo-angular-ui/components/dropdowns/combobox/suggestions/
Expected Result:
When user type 'C', the first word starts with C in the list 'Croatia' is suggested and 'roatia' is selected. But as soon as I type 'y' next to 'c', the combo box is suggesting 'Cyprus' and 'prus' should be selected
Actual Result:
As soon as I type the first word starts with C in the list is 'Croatia' is populated in the Combobox and 'roatia' is NOT selected. So the user cannot type ‘y’ in this case. But the user wants to select ‘CYPRUS’ but 'Croatia' is filled as the input and Cyprus is not suggested.
I have attached the video for the difference between with/without shadow dom.
Also, If you need any additional information, I have created a support ticket:
import { Component } from '@angular/core';
import { SchedulerEvent } from '@progress/kendo-angular-scheduler';
import { sampleData, displayDate } from './events-utc';
@Component({
selector: 'my-app',
template: `
<button (click)="days=1">1 day</button>
<button (click)="days=3">3 days</button>
<kendo-scheduler [kendoSchedulerBinding]="events" [selectedDate]="selectedDate"
startTime="07:00" endTime="19:00"
style="height: 600px;">
<kendo-scheduler-multi-day-view [numberOfDays]="days">
</kendo-scheduler-multi-day-view>
<kendo-scheduler-week-view>
</kendo-scheduler-week-view>
<kendo-scheduler-work-week-view>
</kendo-scheduler-work-week-view>
</kendo-scheduler>
`
})
export class AppComponent {
public selectedDate: Date = displayDate;
public events: SchedulerEvent[] = sampleData;
days = 1;
}Kendo version :
@progress/kendo-angular-buttons: 5.4.1
How to reproduce :
- Add a kendo dropdown button with some items
- Use appendTo='component' popupSetting
- Bind itemClick and close events
Stackblitz example : https://stackblitz.com/edit/kendo-dropdownbuttons-keyboardnavigation?file=app/app.component.ts
What happens :
- If you use arrows to navigate through items, is always skip one item.
- If you use enter or space to select item, the popup close and reopen immediately.
- If you prevent close as in the stackblitz example : enter and space will fire twice the itemClick event.
Provide a built-in Image Editor component such as Kendo UI ASP.NET AJAX:
https://demos.telerik.com/aspnet-ajax/imageeditor/examples/imageupload/defaultcs.aspx