or
0 answers
147 views
[RESOLVED]
Hello,
I have integrated kendo grid with some details-grid using the KendoGridDetailTemplate.
Everything works great, but I can't find a way of hiding the [+] sign when there is nothing to show in the details component.
I am already using the [KendoGridDetailTemplateShowIf]="ShowDetailsCondition" but the problem i'm facing is that when the directive is called, I don't have access to the methods in my component, since "this" changes and represents the directive itself.
<ng-template kendoGridDetailTemplate let-dataItem [kendoGridDetailTemplateShowIf]="showDetailsCondition">
<app-cash-register-main-cash-register-action-form-details
[invoiceHeaders]="invoiceHeaders"
[quoteHeaders]="quoteHeaders"
[shipmentHeaders]="shipmentHeaders"
[subscriptionHeaders]="subscriptionHeaders"
[orderHeaders]="orderHeaders"
[creditNoteHeaders]="creditNoteHeaders"
[document]="dataItem">
</app-cash-register-main-cash-register-action-form-details>
</ng-template>
hasHeaders(dataItem): boolean {
console.log(dataItem);
let document = dataItem;
const type = document.SourceEntity;
const id = document.EntityId;
let documentFound = [];
switch (type) {
case 'InvoiceHeader':
console.log('InvoiceHeader');
const InvoiceHeader = this.invoiceHeaders.find(q => q.Id == id);
documentFound.push(...this.findParentDocumentFromHeader(InvoiceHeader, type));
documentFound.push(...this.findParentDocumentFromLines(InvoiceHeader?.Lines, type));
break;
case 'QuoteHeader':
console.log('QuoteHeader');
const selectedQuoteHeader = this.quoteHeaders.find(q => q.Id == id);
documentFound.push(...this.findParentDocumentFromHeader(selectedQuoteHeader, type));
documentFound.push(...this.findParentDocumentFromLines(selectedQuoteHeader?.Lines, type));
break;
case 'SubscriptionHeader':
console.log('SubscriptionHeader');
const selectedSubscription = this.subscriptionHeaders.find(q => q.Id == id);
documentFound.push(...this.findParentDocumentFromHeader(selectedSubscription, type));
documentFound.push(...this.findParentDocumentFromLines(selectedSubscription?.Lines, type));
break;
case 'OrderHeader':
console.log('OrderHeader');
const selectedOrderHeader = this.orderHeaders.find(q => q.Id == id);
documentFound.push(...this.findParentDocumentFromHeader(selectedOrderHeader, type));
documentFound.push(...this.findParentDocumentFromLines(selectedOrderHeader?.Lines, type));
break;
case 'CreditNoteHeader':
console.log('CreditNoteHeader');
const selectedCreditNoteHeader = this.creditNoteHeaders.find(q => q.Id == id);
documentFound.push(...this.findParentDocumentFromHeader(selectedCreditNoteHeader, type));
documentFound.push(...this.findParentDocumentFromLines(selectedCreditNoteHeader?.Lines, type));
break;
case 'ShipmentHeader':
console.log('ShipmentHeader');
const selectedShipmentHeader = this.shipmentHeaders.find(q => q.Id == id);
documentFound.push(...this.findParentDocumentFromHeader(selectedShipmentHeader, type));
break;
}
if (documentFound.length > 0) {
return true;
}
return false;
}
here is my condition function:
public showDetailsCondition(dataItem: MovementDocumentCustomer): boolean {
console.log(dataItem);
return (
(dataItem.SourceEntity === 'InvoiceHeader' ||
dataItem.SourceEntity === 'ShipmentHeader' ||
dataItem.SourceEntity === 'OrderHeader') &&
this.hasHeaders(dataItem)
);
}
error : "this.hasHeaders is not a function" => I guess it's because "this" represent now the Directive and not my component
How could I use custom methods/function from my component into my condition function without have it returning an error ?
Thanks you!
Audric
Audric
Top achievements
Rank 1
Rank 1
updated question
on
05 Dec 2022
0 answers
108 views
I created a simple recurring event with night and day format (23:00 - 01:30) and never-ending repeat schedule on day view. which does not renders on morning day schedule on (00:00 - 01:30).
public events: SchedulerEvent[] = [{
id: 1,
title: 'Breakfast',
start: new Date('2018-10-20T08:00:00'),
end: new Date('2018-10-21T02:30:00'),
recurrenceRule: 'FREQ=DAILY;'
}];
the above does not renders the schedule for (00:00 - 01:30) but if I add count with recurrenceRule its works.
recurrenceRule: 'FREQ=DAILY;COUNT=10;', - but in my case count is not required.
attached screenshot for reference.
0 answers
95 views
I created a simple recurring event with night and day format (23:00 - 01:30) and never-ending repeat schedule. which renders except on Sunday morning time (00.00 - 01:30).
events: SchedulerEvent[] = [{id: 1,
title: 'Repeat daily',
start: new Date('2022-11-03T06:00:00'),
end: new Date('2022-11-04T01:30:00'),
recurrenceRule: 'FREQ=DAILY;',
}];
Attached screenshot for reference.
0 answers
192 views
Hi team,
I have implemented kendo-grid with search and custom tag filter.If i search any key on the input field data is filtered but in case of custom tag coloumn i have created custom function that is called from filteChange event. and its working but if test it with multiple filter its not working on that.can you tell me any built-in function that is working on both cases.check below attached code snippet for array format.
1 answer
1.2K+ views
Hi
I am using nrwl/nx in my angular application. My angular application contains 5 applications and 6 libraries. It is a big enterprise application.
I am using kendo libraries for angular.
The project can be served without any error
npx nx serve master
master is the starting point . it is angular application that responsible for routing and has main menu component.
As I Mentioned, I can serve the application without any errors. So I can test it localy without any problem.
The problems comes when I decided to package the project in order to deply it to my web server.Here comes the problem
I used this command to build my project
nx run master:build:production
I got many errors like thises:
'kendo-textbox' is not a known element,
'kendo-formfield' is not a known element:
1. If 'kendo-formfield' is an Angular component, then verify that it is part of this module.
2. If 'kendo-formfield' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
It seems that the compiler cannot identifies the kendo libriries when building the project for deployment.
Has any one have suggestions, what could be the reason for this error?
Thanks
1 answer
134 views
The latest version of node_modules/@progress/kendo-angular-scheduler/navigation/focusable.directive.d.ts file has the following import statement:
import { FocusableContainer } from 'src/types/focusable-container';
However, the path is invalid as there is no "src" folder. I can get it to work if I manually change to ../ instead of src/ but we shouldn't have to be editing NPM package files.
Dimiter Topalov
Telerik team
answered
on
01 Dec 2022
1 answer
103 views
Hi,
Is there a way to prevent this grid filter behavior described in the title? I'll try to illustrate it below:
The filter window closes after letting go of the mouse outside of it, the goal is to keep it open.
2 answers
3.5K+ views
How to restrict to have only interger in kendonumeric text box , do not allow user to enter decimal(.)
Aabhar
Top achievements
Rank 1
Iron
Rank 1
Iron
answered
on
01 Dec 2022
2 answers
1.3K+ views
I have the following:
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
encapsulation: ViewEncapsulation.None,
})
export class AppComponent implements OnInit, OnDestroy {
constructor(
[...]
private internationalization: IntlService,
public translateService: TranslateService,
) {
this.translateService.setDefaultLang('fr');
(this.internationalizationasCldrIntlService).localeId = this.translateService.currentLang;
My question is how do I UNIT-TEST such a component, knowing that actually my test gives me the following
and the test is like this:
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { TestBed } from '@angular/core/testing';
import { ReactiveFormsModule } from '@angular/forms';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
import { LayoutModule } from '@progress/kendo-angular-layout';
import { HttpClient } from '@angular/common/http';
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { AppComponent } from './app.component';
import { CoreModule } from './core/core.module';
import { KendoModule } from './shared/kendo.module';
import { AppModule } from './app.module';
import '@progress/kendo-angular-intl/locales/fr/all';
describe('AppComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
imports: [
HttpClientTestingModule,
ReactiveFormsModule,
RouterTestingModule,
NoopAnimationsModule,
CoreModule,
LayoutModule,
KendoModule,
AppModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (http: HttpClient) => new TranslateHttpLoader(http, '/assets/i18n/', `.json?v=${new Date().getTime()}`),
deps: [HttpClient]
}
})
],
declarations: [
AppComponent
],
}).compileComponents();
});
it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app).toBeTruthy();
serge
Top achievements
Rank 2
Bronze
Iron
Iron
Rank 2
Bronze
Iron
Iron
answered
on
30 Nov 2022
0 answers
150 views
We are facing performance issue for textbox control.
While typing the text if we load multiple controls like 5 grids in a single page, the entered text in a textbox taking too much time to appear.
the above-mentioned performance issue is only with textbox and text area not with other controls like dropdown, checkbox, grid etc..
Thanks in Advance
