Does Kendo Scheduler for Angular with custom dates range
multiple months examples 1,2,3 months view at same time.
(And does it support multiple months examples 1,2,3 months view at same time.)
And also can we custom the start and end dates. As of now I only the 1 week for custom dates.
Can you please help.
Hi ,
I am using the Kendo Grid to display some data with checkboxes , I am trying to checked the item checkbox if the item is already selected , the selected item id is store on a separate sql table .
The process is ; load items , load selected items , add selected items to selectedKeys.
for some reason the first time the page is loaded selectedKeys is empty , but if a navigate to another page and back to the page the selected items are checked.
I can only assume the selectedKeys are not populated on time for the grid to update the checkboxes , I have try NgOnInit , ngAfterViewInit.
Any Ideas ?
HTML
<kendo-grid [data]="gridData"
(dataStateChange)="dataStateChange($event)"
[filterable]="true"
[filter]="state.filter"
[sortable]="true"
[sort]="state.sort"
[pageSize]="20"
[pageable]="true"
kendoGridSelectBy="codeNumber"
[selectedKeys]="selectedCodes"
(selectionChange)="onSelect($event)"
[selectable]="selectableSettings">
<kendo-grid-column field="codeNumber" title="Code Number"> </kendo-grid-column>
<kendo-grid-checkbox-column title="Use on Project"></kendo-grid-checkbox-column>
</kendo-grid>
TS
export class PackageCodesMasterListComponent implements OnInit, AfterViewInit {
public gridData: GridDataResult;
packageCodes: PackageCode[] = [];
item: PackageCode;
packageCodeTypes: PackageCodeType[];
public selectedCodes: string[] = [];
projectPackageCodes: ProjectPackageCode[] = [];
public mode: SelectableMode = "multiple";
constructor(private store: Store<IPackageCodeState>, private coreStore: Store<AppState>, private router: Router) {
combineLatest(this.store.pipe(select(selectPackageCodes)), this.store.pipe(select(selectProjectPackageCodes)), this.store.pipe(select(selectPackageCodeTypes))).subscribe(([packageCodes, projectPackageCodes, packageCodeTypes]) => {
if (packageCodes && projectPackageCodes && packageCodeTypes) {
this.packageCodes = packageCodes;
this.projectPackageCodes = projectPackageCodes;
this.packageCodeTypes = packageCodeTypes;
if (this.projectPackageCodes.length > 0) {
this.findSelectedItems();
}
this.gridData = process(this.packageCodes, this.state);
}
})
}
ngOnInit(): void {
this.store.dispatch(getPackageCodes())
this.store.dispatch(getPackageCodeTypes())
this.store.dispatch(getProjectPackageCodes())
}
public ngAfterViewInit() {
//Custom logic could be added here, to be executed once the grid and the selection are loaded
this.findSelectedItems();
}
public state: State = {
sort: [{ field: "codeNumber", dir: "asc" }],
group: [],
filter: {
logic: "and",
filters: [],
},
};
public selectableSettings: SelectableSettings = {
enabled: true,
mode: this.mode
};
public dataStateChange(state: DataStateChangeEvent): void {
this.state = state;
this.gridData = process(this.packageCodes, this.state);
}
findSelectedItems() {
if (this.projectPackageCodes.length > 0) {
this.projectPackageCodes.forEach(item => {
let code = this.packageCodes.find(x => x.packageCodeId === item.packageCodeId)
let y = this.selectedCodes.includes(code.codeNumber)
if (y === false) {
this.selectedCodes.push(code.codeNumber);
console.log(this.selectedCodes.length)
}
})
}
}
https://www.telerik.com/kendo-angular-ui/components/charts/drill-down/
Error: src/app/dashboard/dashboard.component.html:20:23 - error TS7053: Element implicitly has an 'any' type because expression of type 'any' can't be used to index type '{ "Company A": { product: string; sales: number; }[]; "Company B": { product: string; sales: number; }[]; }'.
I am using kendo Multiview calendar .I am expecting that when I click on any of the Weeknumber, complete week should be selected . Kindly help on this . Is there any click event available ?
I am using kendo Multiview calendar . Current implementation is the start day of the week is from Sunday.
I need to make start day of the week as Monday .Kindly help on this
My sample code :
I'm now finding a way to customize the appearance of TabStrip in our app.
As defined in Kendo default theme, the TabStrip was defined with a border roundness by default and this behavior affects both the border of the tabstrip and closable buttons. I concerned if there's a way to configure the TabStrip roundness which works as button's roundness: https://www.telerik.com/kendo-angular-ui/components/buttons/button/appearance/#toc-roundness
Thanks in advance.
<kendo-chart [categoryAxis]="{ categories: categories }">
<kendo-chart-series-defaults type="bar">
<kendo-chart-series-defaults-labels format="c">
</kendo-chart-series-defaults-labels>
</kendo-chart-series-defaults>
<kendo-chart-series>
<kendo-chart-series-item [data]="salesData"> </kendo-chart-series-item>
<kendo-chart-series-item [data]="purchaseData">
</kendo-chart-series-item>
</kendo-chart-series>
</kendo-chart>
I am using the kendo-drawer component at the left side of a page. When the drawer is collapsed, only the icons are visible. At this time I would like to show tooltips over the icons.
I am using the 'items' attribute of Drawer to specify the items. However I do not see any attribute for tooltips in the docs for https://www.telerik.com/kendo-angular-ui/components/layout/api/DrawerItem
Is there anyway this can be achieved?