datatable firing again

Topic: datatable firing again

Aroquiassamy LA ROZE priority asked 1 month ago

datatable page change should not fire again.

datatable page change triggers pagechanged event again. Also pageInfo.page restting to zero,

async pageChanged(pageInfo: MdbPaginationChange) {    
console.log(pageInfo)
if (pageInfo.page == 0) {
  this.companies = await this.companyService.getInitialRows(pageInfo);
}
else
if (pageInfo.page > this.companyService.lastPageNumber()) {
  this.companies = await this.companyService.getNextRows(pageInfo);
}
else
if (pageInfo.page < this.companyService.lastPageNumber()) {
  this.companies = await this.companyService.getPreviousRows(pageInfo);
}

}

companyservice.ts:

async getNextRows(pageInfo:any) {
if (!this.lastVisible) return [];
this.lastPageNumber.set(pageInfo.page);
const companiesCollection = collection(this.db, 'lmscompanies');
const q = query(
  companiesCollection,       
  orderBy('companyName'), 
  startAfter(this.lastVisible), 
  limit(pageInfo.entries)
);
const querySnapshot = await getDocs(q);
if(querySnapshot.size==0)
  return []
this.currentDocs = querySnapshot.docs;
this.firstVisible = querySnapshot.docs[0];
this.lastVisible = querySnapshot.docs[querySnapshot.docs.length - 1];

return this.currentDocs.map(doc => doc.data());

}

Arkadiusz Idzikowski staff commented 1 month ago

Could you please provide more information on how to reproduce this problem step by step?

Aroquiassamy LA ROZE priority commented 1 month ago

{{ header }} Actions {{ data.companyName }} {{ data.companyType }}

      <mdb-table-pagination #pagination (paginationChange)="pageChanged($event)"

>

@ViewChild('table') table!: MdbTableDirective; tableEntries = 3;

headers = ['Company Name', 'Company Type'];

In companyservice I have a signal named lastPageNumber and I set it and use that to call one of the 3 methods: getInitialRows, getNextRows, getPreviousRows. once the correct method is called the data is populated but then the pageChanged is called again and again and the page number is set back to zero.

Please insert min. 15 characters.

Aroquiassamy LA ROZE priority commented 1 month ago

{{ header }} Actions {{ data.companyName }} {{ data.companyType }}
<mdb-table-pagination #pagination (paginationChange)="pageChanged($event)"\>

in ts file:

@ViewChild('table') table!: MdbTableDirective; tableEntries = 3;
headers = ['Company Name', 'Company Type'];

In companyservice I have a signal named lastPageNumber and I set it and use that to call one of the 3 methods: getInitialRows, getNextRows, getPreviousRows. Once the correct method is called the data is populated but the pageChanged is called again and again and the page number is set back to zero.

Please insert min. 15 characters.

Arkadiusz Idzikowski staff commented 1 month ago

Do you modify or use any mdbTable directive or mdb-table-pagination component inputs/methods in these 3 method you mentioned?

Could you please edit your first post and provide a simple HTML and TS code that we could use to reproduce this problem on our end? Based on the given information it is difficult to determine what exactly changes in our component and why the event is triggered again.

adam543 free commented 1 month ago

Hello, Thanks for this info. Official Website

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Priority
Premium support: Yes
Technology: MDB Angular
MDB Version: MDB5 7.0.0
Device: PC
Browser: Chrome
OS: Windows 11
Provided sample code: No
Provided link: No

Aroquiassamy LA ROZE

402Support score
50Questions 22Answers 1Snippets