Apex Code Development You need to sign in to do that
Don't have an account?
Paging Sorting Error
Hi there,
I got following error when I press column header to sort.
I got error when my data records are between 10 and 19 records.
but when i have less than 10 or more than 19 records, there is no error occur.
I pressed Name column 2 times and Reporting Date column 1 time.
Error:
--------
Sorry to interrupt
This page has an error. You might just need to refresh it.
rerender threw an error in 'aura:iteration' [Failed to execute 'insertBefore' on 'Node': The new child element contains the parent.]
Failing descriptor: {aura:iteration}
--------
Source
-------
-------
Thanks,
Regards,
LinThaw
I got following error when I press column header to sort.
I got error when my data records are between 10 and 19 records.
but when i have less than 10 or more than 19 records, there is no error occur.
I pressed Name column 2 times and Reporting Date column 1 time.
Error:
--------
Sorry to interrupt
This page has an error. You might just need to refresh it.
rerender threw an error in 'aura:iteration' [Failed to execute 'insertBefore' on 'Node': The new child element contains the parent.]
Failing descriptor: {aura:iteration}
--------
Source
-------
public class PagingSortingController2 {
@AuraEnabled
public static List<DailyReport__c> getDailyReports() {
String usrId = '0057F000002T3GuQAK';
String strDate = '2018-2-6';
Date dt = Date.valueOf(strDate);
List<DailyReport__c> dReports = [SELECT Id, Name, ReportingDate__c FROM DailyReport__c Where ReportingDate__c =: dt AND Applicant__c =: usrId];
return dReports;
}
}
pagingSorting2.app
<aura:application extends="force:slds" controller="PagingSortingController2">
<aura:attribute type="DailyReport__c[]" name="allAccounts" />
<aura:attribute type="DailyReport__c[]" name="currentList" />
<aura:attribute type="Integer" name="pageNumber" default="1" />
<aura:attribute type="Integer" name="maxPage" default="1" />
<aura:attribute type="String" name="sortField" />
<aura:attribute type="Boolean" name="sortAsc" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:handler name="change" value="{!v.pageNumber}" action="{!c.renderPage}" />
<table class="slds-table slds-table--bordered slds-table--cell-buffer">
<thead>
<tr class="slds-text-title--caps">
<th scope="col">
<div onclick="{!c.sortByName}"
class="slds-truncate"
title="Report Name">
Report Name
<aura:if isTrue="{!v.sortField=='Name'}">
<span>
<aura:if isTrue="{!v.sortAsc}">
↑
<aura:set attribute="else">
↓
</aura:set>
</aura:if>
</span>
</aura:if>
</div>
</th>
<th scope="col">
<div onclick="{!c.sortByReportingDate}"
class="slds-truncate"
title="Reporting Date">
Reporting Date
<aura:if isTrue="{!v.sortField=='ReportingDate__c'}">
<span>
<aura:if isTrue="{!v.sortAsc}">
↑
<aura:set attribute="else">
↓
</aura:set>
</aura:if>
</span>
</aura:if>
</div>
</th>
</tr>
</thead>
<tbody>
<aura:iteration items="{!v.currentList}"
var="record">
<tr>
<th data-label="Report Name">
<div class="slds-truncate" title="{!record.Name}">
{!record.Name}
</div>
</th>
<th data-label="Reporting Date">
<div class="slds-truncate" title="{!record.ReportingDate__c}">
{!record.ReportingDate__c}
</div>
</th>
</tr>
</aura:iteration>
</tbody>
</table>
<c:pagination2 currentPageNumber="{!v.pageNumber}"
maxPageNumber="{!v.maxPage}" />
</aura:application>
pagingSorting2Controller.js
({
doInit: function(component, event, helper) {
var action = component.get("c.getDailyReports");
action.setCallback(this, function(result) {
var records = result.getReturnValue();
component.set("v.allAccounts", records);
component.set("v.maxPage", Math.floor((records.length+9)/10));
helper.sortBy(component, "Name");
});
$A.enqueueAction(action);
},
sortByName: function(component, event, helper) {
helper.sortBy(component, "Name");
},
sortByReportingDate: function(component, event, helper) {
helper.sortBy(component, "ReportingDate__c");
},
renderPage: function(component, event, helper) {
helper.renderPage(component);
},
})
pagingSorting2Helper.js
({
sortBy: function(component, field) {
var sortAsc = component.get("v.sortAsc"),
sortField = component.get("v.sortField"),
records = component.get("v.allAccounts");
sortAsc = sortField != field || !sortAsc;
records.sort(function(a,b){
var t1 = a[field] == b[field],
t2 = (!a[field] && b[field]) || (a[field] < b[field]);
return t1? 0: (sortAsc?-1:1)*(t2?1:-1);
});
component.set("v.sortAsc", sortAsc);
component.set("v.sortField", field);
component.set("v.allAccounts", records);
this.renderPage(component);
},
renderPage: function(component) {
var records = component.get("v.allAccounts"),
pageNumber = component.get("v.pageNumber"),
pageRecords = records.slice((pageNumber-1)*10, pageNumber*10);
component.set("v.currentList", pageRecords);
}
})
pagination2.cmp
<aura:component >
<aura:attribute name="currentPageNumber" type="Integer" required="true" />
<aura:attribute name="maxPageNumber" type="Integer" required="true" />
<div class="slds-button-group" role="group">
<button onclick="{!c.firstPage}" class="slds-button slds-button--neutral">
First
</button>
<button onclick="{!c.prevPage}" class="slds-button slds-button--neutral">
Prev
</button>
<button class="slds-button slds-button--neutral">
{!v.currentPageNumber} / {!v.maxPageNumber}
</button>
<button onclick="{!c.nextPage}" class="slds-button slds-button--neutral">
Next
</button>
<button onclick="{!c.lastPage}" class="slds-button slds-button--neutral">
Last
</button>
</div>
</aura:component>
pagination2Controller.js
({
firstPage: function(component, event, helper) {
component.set("v.currentPageNumber", 1);
},
prevPage: function(component, event, helper) {
component.set("v.currentPageNumber", Math.max(component.get("v.currentPageNumber")-1, 1));
},
nextPage: function(component, event, helper) {
component.set("v.currentPageNumber", Math.min(component.get("v.currentPageNumber")+1, component.get("v.maxPageNumber")));
},
lastPage: function(component, event, helper) {
component.set("v.currentPageNumber", component.get("v.maxPageNumber"));
}
})
-------
Thanks,
Regards,
LinThaw
How?