I have below dataTable
<p:dataTable id="viewTicketsDataTable"
styleClass="inventoryDataTable viewTicketsTable"
value="#{viewTicketsBean.invbean.inventoryModel.getUiTicketList()}"
var="viewTickets"
frame="hsides"
widgetVar="viewTicketsDataTable"
lazy="true"
resizableColumns="true"
scrollable="true"
scrollHeight="540"
scrollRows="30"
sortOrder="ASCENDING"
sortBy="#{viewTickets.id}"
rowKey="#{viewTickets.id}"
emptyMessage="#{viewTicketsBean.invbean.inventoryModel.emptyStatusMessage}"
rowIndexVar="rowIndex" >
<p:ajax id="sortEventId" event="sort" listener="#{sortBean.sort}"
update="#{updateSorting}"
onstart="#{onStartSorting}"
oncomplete="#{onCompleteSorting}"/>
<p:columns id ="dtColId"
value="#{customizeColBean.invbean.inventoryModel.dataTableColumns}"
var="column" columnIndexVar="colIndex" sortBy="#{column.sortKey}" >
<f:facet name="header">#{column.header}</f:facet>
**<p:commandLink styleClass="ticketCls toolTipCls servIdLink"
value="#{viewTickets.id}" rendered="#{column.property eq 'id'}" onstart="openDetailsPopup()"
oncomplete="callContacts();" >
<f:setPropertyActionListener target="#{repairTicketDetailsBean.selectedticketHistory}" value="#{viewTickets}" />
</p:commandLink>**
<h:outputText value="#{viewTickets[column.property]}"
rendered="#{column.property eq 'serviceType' or column.property eq 'serviceId'
or column.property eq 'originId'
or column.property eq 'customName'
or column.property eq 'trackingNumber'
or column.property eq 'deviceName'
or column.property eq 'location'
or column.property eq 'ticketCreatedDateCorrected'}" />
<h:outputText styleClass="detailedStatusCls" value="#{viewTickets[column.property]}"
rendered="#{column.property eq 'detailedStatus'}" />
<h:outputText styleClass="ticketLastModifiedCorrectedCls" value="#{viewTickets[column.property]}"
rendered="#{column.property eq 'ticketLastModifiedCorrected'}" />
</p:columns>
<p:column styleClass="ctl_hide">
<h:outputText styleClass="lastLogEntryTextCls" value="#{viewTickets.lastLogEntryText}" />
</p:column>
<p:column styleClass="ctl_hide" >
<h:outputText styleClass="descriptionCls" value="#{viewTickets.desc}" />
</p:column>
</p:dataTable>
In this I have the first column as commandLink. Once I click on this link, onstart I am opening a dialog and oncomplete I am making two ajax calls using p:commandLink.
The problem here is the oncomplete function is taking a long time to complete and hence my next ajax calls are not able to get triggered(which gets triggered in callContacts javascript method).when I have under 500 rows of data, the oncompleted seems to be faster however when I have around 3000 rows of data it is taking time. Could anyone please explain why it takes time for oncomplete?
One more thing I have tried
<p:commandLink styleClass="ticketCls toolTipCls servIdLink"
value="#{viewTickets.id}" rendered="#{column.property eq 'id'}"
onstart="#{loadTicketDetailsOnstart}openDetailsPopup()"
oncomplete="#{loadTicketDetailsOncomplete}setRowIndex(#{rowIndex+1});callContacts();removeTicketDtlsBlockUI();"
partialSubmit="true" async="true" process="@this">
<f:setPropertyActionListener target="#{repairTicketDetailsBean.selectedticketHistory}" value="#{viewTickets}" />
</p:commandLink>
where I made partialSubmit=true and process=@this after which it reduces the time significantly for the first click of any link.Any subsequent links are still taking some time.Can you please help here what's going on?
NOTE:The time in first case is greater than 15secs and in 2nd case it is 5 secs for first time and 10 to 15secs on subsequent clicks of the link.
Below is my callContacts method
function callContacts(){
alert('first')
var jQcontactsLoadedCls = jQ(".contactsLoadedCls").val();
console.log('jQcontactsLoadedCls called!! ' + jQcontactsLoadedCls)
//if condition is added for create ticket where already contacts are loaded
if(jQcontactsLoadedCls=='false'){
jQ('.titleTktIdCls').text("");
jQ('.titleServiceIdCls').text("");
jQ('.lblServiceTypeCls').text("");
jQ('.lblStatusCls').text("");
jQ('.lblServiceTypeCls').text("");
jQ('.lblCreatedCls').text("");
jQ('.lblCreatedCls').text("");
var jQticketDetailsCL = jQ('.ticketDetailsCL');
jQ(jQticketDetailsCL).click();
}else{
PF('circuitTestdetailsModalDialogWVar').show();
loadTicketDetailsWindow("undefined")
PF("repairTab").select(0);
}
<p:panel id="ticketDetailsMainPanel" styleClass="ticketDetailsMainPanel">
<p:tabView widgetVar="repairTab" class="CktTestPopupTab">
<p:tab title="Ticket Details" rendered="#{repairTicketDetailsBean.ticketDetailsForSid.configFlag == false}">
<ui:include src="ticketDetailsTab.xhtml" ></ui:include>
</p:tab>
<p:tab title="Change Details" rendered="#{repairTicketDetailsBean.ticketDetailsForSid.configFlag == true}">
<ui:include src="configDetailsTab.xhtml" ></ui:include>
</p:tab>
<p:tab title="Work Log" >
<ui:include src="workLogTab.xhtml" ></ui:include>
</p:tab>
<p:tab title="On Site Contact" rendered="#{repairTicketDetailsBean.ticketDetailsForSid.configFlag == false}">
<ui:include src="onSiteContactTab.xhtml" ></ui:include>
</p:tab>
<p:tab title="Ticket Contacts" >
<ui:include src="ticketContactsTab.xhtml" >
<ui:param name="dafaultPrimaryContact" value="#{repairTicketDetailsBean.defaultPrimaryContactName}" />
<ui:param name="dafaultSecondaryContact" value="#{repairTicketDetailsBean.defaultSecondaryContactName}" />
<ui:param name="contactFlow" value="ticketDetails" />
</ui:include>
</p:tab>
<p:tab title="Attachments" >
<ui:include src="attachmentsTab.xhtml" >
<ui:param name="attachmentsFlow" value="ticketDetails" />
</ui:include>
</p:tab>
<p:tab title="CALNET 3" rendered="#{viewTicketsBean.enterpriseUserType != null and viewTicketsBean.enterpriseUserType eq 'CALNET' and repairTicketDetailsBean.ticketDetailsForSid.configFlag == false}">
<ui:include src="CalnetInfo.xhtml" ></ui:include>
</p:tab>
<p:tab title="Call Details" rendered="#{repairTicketDetailsBean.ticketDetailsForSid.serviceType eq '8XX' or repairTicketDetailsBean.ticketDetailsForSid.serviceType eq 'LD' or repairTicketDetailsBean.ticketDetailsForSid.serviceType eq 'VOIP DID' or repairTicketDetailsBean.ticketDetailsForSid.serviceType eq 'VOIP TN'}">
<ui:include src="callDetails.xhtml" ></ui:include>
</p:tab>
</p:tabView>
<p:blockUI id="sidDetailsBlockUiId" block="circuitTestdetailsModalDialogId">
<div class="getMore loading-text">
<div class="loading-circle"></div>
Loading...
</div>
</p:blockUI>
<p:commandLink id="ticketDetailsCL" styleClass="ticketDetailsCL" actionListener="#{repairTicketDetailsBean.getTicketDetails()}" onstart="#{displayInvLoadingScreen}" oncomplete="#{hideInvLoadingScreen}" update="ticketDetailsMainPanel,reqTktClosureBtn" partialSubmit="true" async="true" process="@this"/>
<p:commandLink id="ticketContactDetails" styleClass="ticketContactDetailsCls" actionListener="#{contactInfoBean.getEnterpriseContactInformation('ticketDetails')}" update="ticketDetailsMainPanel" partialSubmit="true" async="true" process="@this"/>
<p:commandLink id="updateContactWorkLog" styleClass="updateContactWorkLogCls" actionListener="#{repairTicketDetailsBean.updateContactInfo()}" onstart="#{displayInvLoadingScreen}" oncomplete="#{hideInvLoadingScreen}loadTicketDetailsWindow(args);" update="ticketDetailsMainPanel" />
<p:inputText id="statusText" styleClass="statusText ctl_hide" value="#{repairTicketDetailsBean.ticketDetailsForSid.detailedStatus}"></p:inputText>
<p:inputText id="tktIdText" styleClass="tktIdText ctl_hide" value="#{repairTicketDetailsBean.ticketDetailsForSid.id}"></p:inputText>
<p:inputText id="serviceType" styleClass="serviceType ctl_hide" value="#{repairTicketDetailsBean.ticketDetailsForSid.serviceType}"></p:inputText>
<p:inputText id="createdText" styleClass="createdText ctl_hide" value="#{repairTicketDetailsBean.ticketDetailsForSid.ticketCreatedDateCorrected}"></p:inputText>
<p:inputText id="updatedText" styleClass="updatedText ctl_hide" value="#{repairTicketDetailsBean.ticketDetailsForSid.ticketLastModifiedCorrected}"></p:inputText>
<p:inputText id="serviceIdText" styleClass="serviceIdText ctl_hide" value="#{repairTicketDetailsBean.ticketDetailsForSid.serviceId}"></p:inputText>
<p:inputText id="serviceLocText" styleClass="serviceLocText ctl_hide" value="#{repairTicketDetailsBean.ticketDetailsForSid.location}"></p:inputText>
</p:panel>
so basically on click of the datatable link I have to open a dialog pop up and make a call to get a details which will be shown in the pop up.I have put a alert inside callContacts() method.On click of the link the alert is coming fast for the first time however after 1st time that alert itself is taking time to come.
One more observation if I remove the update from <p:commandLink id="ticketDetailsCL" styleClass="ticketDetailsCL" actionListener="#{repairTicketDetailsBean.getTicketDetails()}" onstart="#{displayInvLoadingScreen}" oncomplete="#{hideInvLoadingScreen}" update="ticketDetailsMainPanel,reqTktClosureBtn" partialSubmit="true" async="true" process="@this"/> the alert in callContacts is called pretty fast
I hope it is clear now
