Jump to content

Searching Multiple Charts


Recommended Posts

New to Caspio, have had trouble finding what I'm looking for in the "howto", can someone point me in the right direction?

 

I have an excel document with multiple tabs with data on each.  I am able to import that data into a table and make a datapage that displays a chart for each individual tab.  So, multiple charts.

 

What I'd like to do is have a dropdown with the name of each individual chart.  When you choose a name and hit submit, it takes you to the corresponding chart.  Is that possible in Caspio?

Link to comment
Share on other sites

Hi jshilot,

Here is a suggestion for you. Let's say you have two charts to select from

1. Create datapages with the predefined search criterias, based on the tabs of your table and embed them to your HTML page to different <div> tags (with IDs block1 and block2).

2. Make all the <div> tags hidden by default.

3. Create a dropdown with the necessary options

<select id="mysel">
<option>1</option>  <!-- 1 and 2 are the names of your charts, it may be whatever -->
<option>2</option>
</select>
each option will be showing some particular <div>
4. Create a "show" button
<input type="button" value="show" onclick="myHtml()">
5. insert the following script to the <head> of your page.
<script type="text/javascript">
function myHtml() {
var aSelected = document.getElementById('mysel').options[mysel.selectedIndex].text;
 
if (aSelected == '1') {   //1 is the name of the chart same as in dropdown
document.getElementById('block1').style.display = 'block';
document.getElementById('block2').style.display = 'none';
} else if (aSelected == '2') { //2 is the name of the chart same as in dropdown
document.getElementById('block1').style.display = 'none';
document.getElementById('block2').style.display = 'block';
}
}
</script>

 

 

quantity of "if else" instructions may vary with the different quantity of your charts.

Let me know how it works  ;)

Link to comment
Share on other sites

Not what I had in mind - but looks to be working close to what I was hoping for!

 

The only issue I'm having is with hiding the <div>.  I'm admittedly not the strongest coder in the world.  This is what I was trying:

 

<div id="block2" style="display:none">

 

This technically works, but my chart is coming through looking strange and crunched for some reason.  Using the iframe version of the data page, not sure if that helps.  Seems like the style is messing with the chart in some way.   Any better ideas on how to hide it?

 

Thanks so much for your help!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...