I want the page to be refreshed after the user has clicked a certain button but the problem is this page A is loaded within another page B so when I use location.reload(), it always refreshes back to B than A.
For instance,
My page B is called customerMain.html, and inside I use jQuery to load the page A (called customerOrders.html) when the customer clicks "Orders" tab.
Page B:
<button id="orders-page">Orders</button>
<div id="page-switch"></div>
<script>
$("#orders-page").on("click", function(){
$("page-switch").load("customerOrders.html");
});
<script>
Page A:
<button id="refresh-page">Refresh</button>
<script>
location.reload() // Refreshes to Page B BUT want Page A
<script>
I tried to solve it by changing location.reload() to window.location.href = "customerOrders.html", but the problem on this is actually in my project, Page B have other tabs too but this command will eliminate the tabs in Page B and only show Page A's content, and the CSS I predefined in Page B but also applied to page A(I know it's better to link the external CSS) also get lost.
Any good idea to solve this? Thanks!
PS: Yea, I mean after click Refresh button in Page A it should perform the same thing as you click the Orders button in Page B