This is the footprint of my web api
public DataSourceResult GetItems([System.Web.Http.ModelBinding.ModelBinder(typeof(WebApiDataSourceRequestModelBinder))]DataSourceRequest request)
Fiddler shows data being returned from the api as expected.
In my Angular service I have
return this.http
.get<GridDataResult>(`${this.url}?${queryStr}`)
.map(({data, total}: GridDataResult) =>
(<GridDataResult>{
data: data,
total: total,
})
);
In this case, my grid displays no records. If I change "data" to "Data" and "total" to "Total", my IDE complains
error TS2551: Property 'Data' does not exist on type 'GridDataResult'. Did you mean 'data'?
error TS2551: Property 'Total' does not exist on type 'GridDataResult'. Did you mean 'total'?
but.. with the "D" and the "T" I get data bound to the grid in spite of the compiler error (sometimes Node throws a message that there are compiler errors but usually the page displays data). Fiddler shows the api returning "Data" where the console in the browser shows "data".
I've deleted everything and installed from scratch. I updated all of my packages to latest including the Kendo packages.
I was suspicious of my install as in HTML files I receive an error on the Kendo tab, kendo-grid-column generates an error that it is not in the current scope. This is an IDE error and when I run, the gird looks fine.
I was using v2 of the default theme and have upgraded to the latest kendo-theme-default (3.7.0) scss (material and bootstrap as well for testing) and when I am creating a kendoGridDetailTemplate inside of my grid, if no data is returned, it is cutting off the "no data available" as seen in the picture. Is this a bug or am I missing something? Does the same in default, material, and bootstrap scss themes.
If I change it to "kendoGridDetailTemplate" instead of "*kendoGridDetailTemplate" it displays the whole title. HOWEVER, it will not show the + or - button.
my grid setup
<kendo-grid [data]="view | async">
<kendo-grid-column field="customerName" title="Customer Name"></kendo-grid-column>
<div *kendoGridDetailTemplate="let dataItem">
<ifp-proposal (dialogOpen)="openIFPDialog($event)" [searchOptions]="searchOptions" [Customer]="dataItem"></ifp-proposal>
</div>
</kendo-grid>
scss i'm using:
@import '~bootstrap/scss/bootstrap';
@import "~@progress/kendo-theme-default/scss/panelbar";
@import "~@progress/kendo-theme-default/scss/grid";
@import "~@progress/kendo-theme-default/scss/multiselect";
@import "~@progress/kendo-theme-default/scss/switch";
@import "~@progress/kendo-theme-default/scss/datetime";
Hi,
I'm adding virtual scrolling to my awesome al-grid component which can have sub-grid (detail row) and I've found out that if I expand one row and scroll down to the pageSize number of rows and then scroll up, it jumps down 10 rows (approximately)
I managed to reproduce the issue here. Am I missing something?
So in my case, you'll see the jump when you reach row 5.
Regards,
/Pouya
Aditro
Can someone please give an explanation?
Say there's an event with start: new Date("2019/6/3 02:00 AM"), and end: new Date("2013/6/3 03:00 AM"). It is displayed with following scheduler configuration.
date:
new
Date(
"2019/6/3"
),
startTime:
new
Date(
"2019/6/3 00:00"
),
endTime:
new
Date(
"2019/6/3 06:00"
)
Whereas, with the following configuration will render the scheduler, but not the event.
date:
new
Date(
"2019/6/3"
),
startTime:
new
Date(
"2019/6/2 23:00"
),
endTime:
new
Date(
"2019/6/3 06:00"
)
This problem occurs with views which require time, i.e. day, week views etc.
P.S. I am using v2017.2.504 of kendo.all.min.js file.
Hi,
We are implementing filtering in Kendo Angular treeview.For that we are considering two options
Option 1:
Filtering based on below link
https://qqf7hb.run.stackblitz.io/
This example works fine. But it includes all child nodes/items of parent even child items does not contain filtered text. (only parent node contains filtered text and non of the child nodes/items. But still all the child nodes/items of parent are shown)
Do you have any sample to show filtering like below example
https://demos.telerik.com/kendo-ui/treeview/filter-treeview-in-dialog
Option 2:
Don't filter any nodes/items. While typing in filtering textbox, expand all parent and child nodes of treeview and display all nodes/items which has filtered text with different style (preferably with yellow background like attached image) and scroll the treeview to the first occurance of node/item which has filtered text (As there will be lot of items in the treeview with scroll bar)
It would be great if you can provide any sample for this approach
Thanks,
Rajesh
Hello,
currently the dialog component and service only allows the action buttons to be stretched, that's not what we want, because it doesn't match our application's style. We would like to have the buttons in "normal" layout, like it is possible with the Kendo UI jQuery counterpart. I already logged a feature request in the Feedback Portal, but until it may be implemented sometime we need a workaround.
Is there any other solution than overriding all relevant CSS styles?
Regards,
Holger
I've combined 2 of your demos, the grouped data one, and the filter directive one. Filtering doesn't work in this example. Is it possible to make the filtering work with the directive? (I assume I can fall back on manually filtering the data).
https://stackblitz.com/edit/angular-evmvba
I'm trying to apply Grouping (https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/grouping/) to a multiselect where the data is bound using the async pipe. (https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/data-binding/#toc-async-pipe).
I'm getting a bit stuck, is what I'm trying to do possible? any chance of modifying the example for the async pipe to group the data?
In the paging section( https://www.telerik.com/kendo-angular-ui/components/grid/paging/) there is a directive to further control the pager content of the grid. What I was trying to accomplish is having a HTML number input to allow users to specify their desired page size. However my 'onchange' event is never firing for the input control.
In the Pager Template stack blitz example there is a slider that is able to bind to events. Is there some limitation on what controls that can be used with the directive?
Event for onchange
setPageSize(value: any ) {
console.log('value => ' + JSON.stringify(value));
}
HTML for Pager template
01.
<
ng-template
kendoPagerTemplate
let-totalPages
=
"totalPages"
let-currentPage
=
"currentPage"
>
02.
<
kendo-pager-prev-buttons
></
kendo-pager-prev-buttons
>
03.
<
kendo-slider
04.
[showButtons]="false"
05.
[tickPlacement]="'none'"
06.
[max]="totalPages"
07.
[min]="1"
08.
(valueChange)="sliderChange($event)"
09.
[value]="currentPage">
10.
</
kendo-slider
>
11.
<
kendo-pager-info
></
kendo-pager-info
>
12.
<
kendo-pager-next-buttons
></
kendo-pager-next-buttons
>
13.
<
input
type
=
"number"
value= {{pageSize}} (onchange)="setPageSize($event)" >
14.
</
ng-template
>
Hi,
Its been nearly a year now that I am waiting for Kendo to provide a auto-fit/ resize option. Tried something like
public onDataStateChange(): void {
this.fitColumns();
}
private fitColumns(): void {
this.ngZone.onStable.asObservable().pipe(take(1)).subscribe(() => {
this.grid.autoFitColumns();
});
}
But this doesn't seem to work also. Our business requirement needs us to do the auto resize since we create our grids on the fly.
Any solutions yet?