how to show/hide the single element when coming from different pages?

Question

I have 2 pages name "A" & "B", both pages have a link which will open the same page "X". But page "X" will show/hide some components as per from which page its coming.

On page "X", I want to show/hide my buttons on page named "X".

If I come from "Page A" > they should be visible.

And If I come from "Page B" > they should not be visible.

==========================================

I am taking approach for doing this is by passing variable/value in URL on page A and B.

HTML code page A:-

<a data-fancybox-type="iframe" class="various marginLeft10 button" href="/Provision/Summary/MC-IT0401-ATUTEJA?abc">View Summary</a>

HTML code page B:-

<a class="marginLeft50 button" href="/Provision/Summary/MC-IT0401-ATUTEJA?xyz">Confirm & Proceed</a>

Page X Code=

<div class="marginTop50 marginBottom valignBottom" role="button" id="summaryButtons">
    <input type="button" class="active" value="Back" id="stepSummaryBack">
    <input type="button" class="bigButton marginLeft50" value="Ready for Diagnostic" id="stepSummaryConfirm">
</div>

This Particular Div should show/hide as per navigation from page "A" or "B".

I am not sure now how to confirm the URL along with the variables ( ?abc and ?xyz ) I am passing in the "href" using jquery.

Please suggest.

And let me know if anything is not clear or need more details.

Answer 1

So in the onload event could you just do.

 var URL = window.document.URL.toString();
           var vars = URL.split("?");
       then your variable should be vars[1];

Answer 2

I would suggest handling the show/hide decision while rendering Page X, not with javascript once it has already loaded. You don't need to use query params in your url ( ?abc and ?xyz ). Access the HTTP_REFERER from the Page X request in your controller to see whether the request came from /page_a or /page_b , then use that information while rendering Page X to determine whether or not to include the buttons.