datatable firing again


Topic: datatable firing again

Aroquiassamy LA ROZE pro premium priority asked 3 months 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 3 months ago

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


Aroquiassamy LA ROZE pro premium priority commented 3 months 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 pro premium priority commented 3 months 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 3 months 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 commented 2 months ago

Hello, Thanks for this info. https://www.yourtexas-benefits.com">Official Website


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
  • User: Pro
  • 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