Show/hide Results Page

[JEllington]

Hello, I have a Search and Results web page (simular to what is described here.. http://howto.caspio.com/tech-tips-and-articles/parameters/add-a-search-interface-to-results-sets-page ). The web page has a search submission form and two different results data pages (report1 and report2), both results pages receive parameters from the submission form and display tabular reports on the web page as expected. So far so good.
The first virtual field in the submission form is a dropdown that offers the selections "report1 and report2, passing that parameter as [@report] on exit.
How can I display/hide the results pages depending on the [@report] parameter received.

Any and all suggestions are greatly appreciated. 

[MayMusic]

Have a div around each report deploy code and give it an ID and hide it, for instance:

 

Report 1:

<div id="r1" style="display:none;">
Caspio Deploy code of report 1
</div>

Report 2:

<div id="r2" style="display:none;">
Caspio deploy code for report 2
</div>

 And then on the web page have this script below all deploy codes:

<script>
var report = getParameterByName('r');
if (report == 'r1'){
document.getElementById('r1').style.display = 'inline-block'; 
}

else if (report == 'r2'){
document.getElementById('r2').style.display = 'inline-block'; 
}

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^]*)|&|#|$)"),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}
</script>

Note, the destination after submission on search page you have URL to the page where you have deployed your pages in this format:

 

http://URL?r=[@field:NAME OF THE FIELD USER SELECTS REPORT]

[MayMusic]

It is better if you create two report web pages and for the dropdown have:

 

display  | Value

Report 1 | URL of Report 1

Report 2 | URL of Report 2

 

And use this virtual field as destination after submission.

[JEllington]

Thank you for the suggestion MayMusic.

Creating separate report pages as suggested, actually was my first solution. After testing it out, I thought it would be cleaner to have the search and both report pages on the same page. So the user isn't taken away from the main page, then have to go back again after viewing the report.
And.... thats when I painted myself into this corner of not knowing how to hide/display the report pages.  

 

I've found where I can show/hide the data pages on the web page by using css, Although I don't know how to get the web page to pull the [@report] parameter that the search form is passing internally through CB.

[JEllington]

MayMusic, your solution worked beautifully. 
You taught me a lot by studying your code. Externally passing the parameter ( r ) as destination upon submission, then creating the function getParameterByName to extract its properties,  is Genius.

 

Thank You Sooo Much!!
Jim

[MayMusic]

You are welcome I like challenges and I am also learning