https://stackblitz.com/edit/angular-pxppfk-s4ix7b?file=tsconfig.json
Change target in tsconfig in this stackblitz to targer es2022 to recreate bug
The inner circle of radio buttons are incorrectly scaled/positioned in Bootstrap themes. The radio buttons in bootstrap theme are by default dependent on "rem" unit. For applications, that specify different base for "rem" unit, than 16px, it is possible to naturally override dimensions of the radio button without any specific overrides.
In example application, the following points are important:
1. :root specifies font-size=24px. So 1rem=24px.
2. Radio buttons uses size="small". The width and height then defaults to 0.75rem=18px.
Important note, is that the wrong positioning of inner circle is most visible when scaling down the browser view. There is offset by 1px to the sides. The image in the attachments is screenshot from the application and demonstrates the offset in pixels from the sides. The first number above the radio button is the offset of the inner circle in pixels from the left, the second number after "/" is the offset of inner circle from the right.
This issue appears only if the dimensions are being increased/decreased in respect to the default "medium" size. If the radio button is scaled using "scale" CSS function, then the scaling is correctly preserved. Also I didn't notice any problem for the "medium" sized radio button in any browser view. The root font-size might not be important for bug to be reproducible, but inconsistencies are then more visible.
when click kendo slider increment or decrement tile it's moving two small steps.
My case instead of moving two steps, one step need to move
Using the Editor component with Form Support, if I choose the style Heading 1 and type some letter.
I clean the value using only backspace key on the keyboard and the value of the form control is <h1></h1>.
This is reproductible on the demo : https://www.telerik.com/kendo-angular-ui/components/editor/forms/#toc-template-driven-forms
Expected result
hello i`m always using kendo grid in my project but i can`t import excel to kendo grid please make it possible to import excel file and select specific sheet to kendo grid
1. Start using the Kendo Tree View in Angular.
2. Load a large dataset for the Kendo Tree View, observe the time taken to render the Tree View.
3. The timing will increase if the dataset keeps on increasing.
4. Suggest some ways to reduce or optimize it.
This is how I am using the Kendo TreeView in Angular,
I need access to Sketch support files containing the existing UI elements for Kendo for Angular so that I can create comps for my design. Ideally this would be a collection of sketch symbols that match the current Kendo UI design.
input to grid:
@Input()
public additionalExcelExportInfos: { additionalWorksheetTitle: string,
parameters: { key: string, parameterValue: any }[]
};
output in excel file:
Currently kendo ListBox does not support double click event.
Implement kendo ListBox in Angular.
Double click on a row.
No event is emitted.
https://stackblitz.com/edit/angular-5elhtu?file=src%2Fapp%2Fapp.component.ts
When a detail row is used, the moment you expand one row and scroll, it automatically loads the last items from the dataset.
Ex expand row 1 - start scrolling, and it suddenly loads 5xx th row+;
When grouping is also enabled - expanding the detail row under one group, expands it under all groups.
The stackbliz is from the kendo demo page for virtualscroll (with the added detail row).
Hi team.
We would like to provide a possibility to use our specific masks for Date Picker component, like this:
Can you recommend a good solution for this?
In the TimePicker (and other Date Input controls) you can in the input field use the arrow keys or mousewheel to go endless through the options. E.g. for minutes you can go directly from 00 to 59 using the down arrow. Especially with large ranges like minutes this is handy.
But in the popup you can't do that. It would be nice that the user can scroll directly from 00 to 59, 58 and so on. See composed image below.
(This should not be done when there are less options than the size of the popup, else you whould get duplicate options visible. That would be confusing for the user.)
Would be a usefull feature, especially when using this control on touch devices.
If you have a kendo grid table with some data over multiple pages and you go e.g. to the last page and then reload the data, resulting with less pages - the table is empty and you have to manually click on the first page to see the data. Here is a working example:
https://codesandbox.io/s/upbeat-lamarr-d67m8k?file=/src/app/app.component.ts
Step 1. Go to the last page
Step 2. Click on the button "'Reset data" <- you see no data
Step 3. Click on the first page <- You see the data
Use the basic usage example from https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/
Click in the area next to the baseball chip.
The list with available objects pops up.
Click in the place where the cursor is, the popup won't close.
Click in the right half of the component, the popup closes.
It seems it's the input element which swallows the click event.
I would expect the popup to be closed, no mather where I click in the component
Here is a simple example:
HTML:
<kendo-listview
[height]="400"
[data]="notes$ | async"
class="k-d-flex-overflow-auto"
(scrollBottom)="loadMore()">
<ng-template kendoListViewHeaderTemplate>
<span title>Reminders</span>
</ng-template>
<ng-template kendoListViewItemTemplate let-dataItem="dataItem">
<app-message-note [note]="dataItem"></app-message-note>
</ng-template>
</kendo-listview>
TS:
@Component({
selector: 'app-message-list',
templateUrl: `./message-list.component.html`,
styles: [
`
.k-d-flex-overflow-auto {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
overflow: auto;
}
`,
],
})
export class MessageListComponent implements OnInit {
notes$: Observable<NoteDto[]>;
constructor(private replyService: ReplyNoteService) {}
ngOnInit(): void {
this.notes$ = this.replyService.getUserNotesList();
}
loadMore() {
console.log('loading...');
}
}
Without these styles scroll is not visible.
Current behavior: scroll to the bottom, nothing happens.
Expected behavior: scroll to the bottom "loading..." will be logged to the browser console.
Given: a kendo grid with resize enabled.
And: the input locked on kendo-grid-colum is undefined (by ex. due the component class property not initialized)
When: the user double click on the column resize handler
Actual: the column width is set to 0
Expected: the colum autofit behaviour remain consistent and set the column width as usual.