PrimengDatatableHelper.getsorting #5091

0

alirizaadiyahsi created 6 years ago

Is there another datatable in page(not in modal)? If yes, be sure they have different ids and different primengTableHelper. There is an example in audit logs page. You can check it.

0

abdourahmani created 6 years ago

Hi @alirizaadiyahsi

let me better explain my situation, using the audit logs page you mentioned.

As a response to clicking the magnifier button, I open a modal page containing a datatable. It's then that this error appears.

Best regards,

Abdourahmani

0

ismcagdas created 6 years ago

Support Team

@abdourahmani,

Could you share your javascript code for the modal ?

0

abdourahmani created 6 years ago

Hi @ismcagdas Please find the javascript code for the modal below.

Regards, Abdourahmani

import { Component, ViewChild, Injector, Output, EventEmitter } from '@angular/core';
import { ModalDirective } from 'ngx-bootstrap';
import {
    PaliersServiceProxy,
    CreateOrEditPalierDto,
    PalierDetailsServiceProxy,
    PalierDetailDto
} from '@shared/service-proxies/service-proxies';
import { AppComponentBase } from '@shared/common/app-component-base';
import { TypePalierLookupTableModalComponent } from './typePalier-lookup-table-modal.component';
import { CreateOrEditPalierDetailModalComponent } from '@app/main/remuneration/paliers/create-or-edit-palierDetail-modal.component';
import { DataTable } from 'primeng/components/datatable/datatable';
import { Paginator } from 'primeng/components/paginator/paginator';
import { LazyLoadEvent } from 'primeng/components/common/lazyloadevent';
import { FileDownloadService } from '@shared/utils/file-download.service';

@Component({
    selector: 'createOrEditPalierModal',
    templateUrl: './create-or-edit-palier-modal.component.html'
})
export class CreateOrEditPalierModalComponent extends AppComponentBase {
    @ViewChild('createOrEditModal') modal: ModalDirective;
    @ViewChild('typePalierLookupTableModal') typePalierLookupTableModal: TypePalierLookupTableModalComponent;

    @ViewChild('createOrEditPalierDetailModal') createOrEditPalierDetailModal: CreateOrEditPalierDetailModalComponent;
    @ViewChild('dataTable') dataTable: DataTable;
    @ViewChild('paginator') paginator: Paginator;

    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    active = false;
    saving = false;
    advancedFiltersAreShown = false;
    filterText = '';
    maxTauxFilter: number;
    maxTauxFilterEmpty: number;
    minTauxFilter: number;
    minTauxFilterEmpty: number;

    palier: CreateOrEditPalierDto = new CreateOrEditPalierDto();
    typePalierDescript = '';

    constructor(
        injector: Injector,
        private _paliersServiceProxy: PaliersServiceProxy,
        private _palierDetailsServiceProxy: PalierDetailsServiceProxy,
        private _fileDownloadService: FileDownloadService
    ) {
        super(injector);
    }

    show(palierId?: number): void {
        if (!palierId) {
            this.palier = new CreateOrEditPalierDto();
            this.palier.id = palierId;
            this.palier.orderBy = '001';
            this.typePalierDescript = '';

            this.active = true;
            this.modal.show();
        } else {
            this._paliersServiceProxy.getPalierForEdit(palierId).subscribe(result => {
                this.palier = result.palier;
                this.typePalierDescript = result.typePalierDescript;

                this.active = true;
                this.modal.show();
            });
        }
    }

    savePalier(): void {
        this.saving = true;
        this._paliersServiceProxy
            .createOrEdit(this.palier)
            .finally(() => {
                this.saving = false;
            })
            .subscribe(() => {
                this.notify.info(this.l('SavedSuccessfully'));
                this.close();
                this.modalSave.emit(null);
            });
    }

    openSelectTypePalierModal() {
        this.typePalierLookupTableModal.id = this.palier.typePalierId;
        this.typePalierLookupTableModal.displayName = this.typePalierDescript;
        this.typePalierLookupTableModal.show();
    }

    setTypePalierIdNull() {
        this.palier.typePalierId = null;
        this.typePalierDescript = '';
    }

    getNewTypePalierId() {
        this.palier.typePalierId = this.typePalierLookupTableModal.id;
        this.typePalierDescript = this.typePalierLookupTableModal.displayName;
    }

    close(): void {
        this.active = false;
        this.modal.hide();
    }

    getPalierDetails(event?: LazyLoadEvent) {
        this.createOrEditPalierDetailModal.palier = this.palier;
        if (this.primengDatatableHelper.shouldResetPaging(event)) {
            this.paginator.changePage(0);
            return;
        }

        this.primengDatatableHelper.showLoadingIndicator();
        this._palierDetailsServiceProxy
            .getAll(
                this.filterText,
                this.palier.code, // filtre les elements du palier séléctionné
                this.maxTauxFilter == null ? this.maxTauxFilterEmpty : this.maxTauxFilter,
                this.minTauxFilter == null ? this.minTauxFilterEmpty : this.minTauxFilter,
                this.primengDatatableHelper.getSorting(this.dataTable),
                this.primengDatatableHelper.getSkipCount(this.paginator, event),
                this.primengDatatableHelper.getMaxResultCount(this.paginator, event)
            )
            .subscribe(result => {
                this.primengDatatableHelper.totalRecordsCount = result.totalCount;
                this.primengDatatableHelper.records = result.items;
                this.primengDatatableHelper.hideLoadingIndicator();
            });
    }

    reloadPage(): void {
        this.paginator.changePage(this.paginator.getPage());
    }

    createPalierDetail(): void {
        this.createOrEditPalierDetailModal.show();
    }

    deletePalierDetail(palierDetail: PalierDetailDto): void {
        this.message.confirm('', isConfirmed => {
            if (isConfirmed) {
                this._palierDetailsServiceProxy.delete(palierDetail.id).subscribe(() => {
                    this.reloadPage();
                    this.notify.success(this.l('SuccessfullyDeleted'));
                });
            }
        });
    }

    exportToExcel(): void {
        this._palierDetailsServiceProxy
            .getPalierDetailsToExcel(
                this.filterText,
                this.palier.code, // filtre les elements du palier séléctionné
                this.maxTauxFilter == null ? this.maxTauxFilterEmpty : this.maxTauxFilter,
                this.minTauxFilter == null ? this.minTauxFilterEmpty : this.minTauxFilter
            )
            .subscribe(result => {
                this._fileDownloadService.downloadTempFile(result);
            });
    }
}

0

abdourahmani created 6 years ago

@alirizaadiyahsi

I finally got what you meant, applied it but it didn't help.

0

ismcagdas created 6 years ago

Support Team

Hi,

You also need to create a new PrimengDatatableHelper, primengDatatableHelper2 for example and use it for your datatable in the modal. Could you try like that ?

6 Answer(s)