Topic: datatable firing again

Aroquiassamy LA ROZE priority asked 1 week 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 6 days ago

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


Aroquiassamy LA ROZE priority commented 5 days 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.


Aroquiassamy LA ROZE priority commented 5 days 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.


Arkadiusz Idzikowski staff commented 4 days 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.



Please insert min. 20 characters.

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