Hi Team,
Allow the ability to change the styling on the inner input of the component. This will allow developers easy access to change the placeholder styling based on condition or overall input element. Currently, a custom implementation like the following can be used:
https://stackblitz.com/edit/angular-pzv7zc?file=app/app.component.ts
or with a directive:
https://stackblitz.com/edit/angular-pzv7zc-v4te8u?file=app%2Fapp.component.ts
Thanks.
While the grid is initially loading data, the "No records available." message is confusing and provides no useful information.
Expected behavior - when the grid is initially loading, don't display the message as the rows/data might very well appear
To reproduce basically just go to the grid demo page (refresh if needed) and pay attention to the grid loading: https://www.telerik.com/kendo-angular-ui/components/grid/data-binding/
Example in our project - intuitively you'd think that the grid has no records until you see the loader; in any case, the message looks out of place:
When increasing the browser zoom level while using a kendo-splitter with two kendo-splitter-pane elements, one of the panes exceeds the boundaries of the kendo-splitter. As a result, part of the content becomes hidden.
Steps to Reproduce:
Template:
<kendo-splitter>
<kendo-splitter-pane [collapsible]="true" size="30%">
<div>
<h3>Inner splitter / left pane</h3>
<p>Resizable and collapsible.</p>
</div>
</kendo-splitter-pane>
<kendo-splitter-pane>
<div>
<h3>Inner splitter / center pane</h3>
<p>Resizable only.</p>
</div>
</kendo-splitter-pane>
<kendo-splitter-pane [collapsible]="true" size="30%">
<div>
<h3>Inner splitter / right pane</h3>
<p>Resizable and collapsible.</p>
</div>
</kendo-splitter-pane>
</kendo-splitter>
The page numbers and total items within a pager do not appear to respect the currently loaded i18n locale. For example, there's no comma in the thousands place for the en locale. What makes me believe this is a bug is that the page input which can appear DOES have i18n applied to it so the discrepancy is clearly visible between the two.
As there's no demo with such large page numbers I've created an example as well as a screenshot:
B187rdik (forked) - StackBlitz
By default the grid pagination only works taking count of the actual records instead of (alternatively) taking in consideration the groups count.
It would be nice to have the possibility to choose between those 2 when using groupBy and process functions.
This pagination feature is already implemented in the Kendo Ui for Asp.Net Core, but it is not available in functions such as process, groupBy or (toDataSourceRequest/toDataSourceRequestString/toOdataString)
Here you can find the related documentation page for the Asp.Net implementation.
Right now the only possible way to achieve this behavior in combo with a KendoAngularGrid is to use the (toDataSourceRequest/toDataSourceRequestString), then into the controller you'll have to mutate the DataSourceRequest Object like following:
[HttpGet]
public async Task<IActionResult> GetData([DataSourceRequest] DataSourceRequest request, CancellationToken cancellationToken) {
var data = //... ;
request. Skip = (request.DataSourceRequest.Page - 1) * request.DataSourceRequest.PageSize;
request.Take = request.DataSourceRequest.PageSize;
request.IsExcelExportRequest = true; // without this the items property of the GroupResult type will be null
request.GroupPaging = true;
return Ok(await data.ToDataSourceResultAsync(request, cancellationToken);
}
Hi,
I'd like to request a feature for programmatically dismissing notifications in Angular. This is a common feature for notification / toast component, but it is missing in Kendo UI for Angular.
Right now, once a closable notification is shown, there's no way to dismiss it programmatically, which can lead to clutter (see attached screenshot).
Here are the proposed features:
Programmatic Notification Dismissal:
Global Notification Limit:
These additions would greatly enhance the user experience by preventing notification clutter and providing better control for developers.
Thanks for considering this!
Best, Sergei.
Hi,
I've noticed a strange issue with the ContextMenu: in Firefox, the div text selection loses focus after the context menu is shown.
Here is FireFox context menu behavior (focus lost on selected text).
Sample Code:
Please let me know if there is any solution for this.
Thanks,
I'm experiencing an issue with the filtering and sorting functions in a Kendo Grid. This problem seems to occur with the latest version of Kendo UI for Angular in combination with Angular 18.
I have created a sample project on StackBlitz where the issue can be reproduced: StackBlitz Project.
In the example, you can see that the filtering and sorting capabilities are enabled. However, both filtering and sorting do not seem to work correctly.
Here is a relevant code snippet:
<kendo-grid [data]="gridData" [selectable]="selectableSettings" [navigable]="true" [height]="300" filterable="menu, row" [sortable]="true">
<kendo-grid-column field="ProductName" title="Product Name"></kendo-grid-column>
<kendo-grid-column field="UnitsInStock" title="Units In Stock"></kendo-grid-column>
<kendo-grid-column field="UnitsOnOrder" title="Units On Order"></kendo-grid-column>
<kendo-grid-column field="ReorderLevel" title="Reorder Level"></kendo-grid-column>
</kendo-grid>
What I have tried:
Current behavior:
Expected behavior:
Am I doing something wrong, or does this seem to be an issue with the Kendo UI framework? Any suggestions or solutions are welcome!
Thanks in advance for the help!
https://stackblitz.com/edit/angular-pxppfk-s4ix7b?file=tsconfig.json
Change target in tsconfig in this stackblitz to targer es2022 to recreate bug
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
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:
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).
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
Thank you for providing information about customization using <kendo-grid-message>
We can customize text inside drag a column here.... using <kendo-grid-message>
but in that line I am willing to add column chooser and one icon
i.e in tag <kendo-grid-group-panel> I want to add column chooser and one icon
please find below screen shot, in highlighted areas I want to add mentioned things
I want to replace highlighted areas in tag <kendo-grid-group-panel> as
Please help me for this issue