I have implemented LIKE and UNLIKE buttons on a post page, where the LIKE button submits a form to create a CPT using a page reload, and the UNLIKE button deletes the CPT without a page scroll due to AJAX. I want to improve the UX by using JavaScript for a page refresh upon successful form submission.
Solution:
To reload the page after a successful form submission without a clunky scroll, use jQuery’s ajaxComplete event to trigger a JavaScript reload. This will refresh the page only after the AJAX request completes.
This approach triggers a refresh right after the AJAX completion, maintaining the user's scroll position.