VF Page: This is my pagination in VF:
`<apex:repeat value="{!paginationNumbers}" var="pageNumber">
<li class="page-item" id="pageItem{!pageNumber}" >
<a class="page-link" onclick="paginationFilter(this)">{!pageNumber}</a>
</li>
</apex:repeat> `
Onclick it is calling a paginationFilter method which is like this:
`function paginationFilter(clickedElement) {
clickedButton = clickedElement;
document.getElementById("loader").style.display = "block";
var value = clickedElement.innerText;
console.log(value);
paginationControllerMethod(value);
}`
this paginationControllerMethod(value); is calling a Apex method by using apex:actionfunction:
<apex:actionfunction name="paginationControllerMethod" action="{!pagination}" rerender="pagination" oncomplete="anotherFunction()">
<apex:param name="value" value="value" assignTo="{!paginationNumber}" />
</apex:actionfunction>
after calling the apex method it should first rerender the component and then call the anotherfunction. but I guess another function is executing first and then rerendering is happening.
Another function:
`function anotherFunction() {
var value = clickedButton.innerText;
// Remove 'active' class from all elements with class 'page-item'
var elements = document.getElementsByClassName('page-item');
for (var i = 0; i < elements.length; i++) {
elements[i].classList.remove('active');
}
console.log(clickedButton);
// Add 'active' class to the clicked element
clickedButton.parentElement.classList.add('active');
}`
if i remove pagination from rerender then clicked button becomes active. another method is working fine but the execution between rerender and oncomplete is not as expected as it should be. I want rerender should execute first then the oncomplete attribute execute later.