Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

How to hide/show span based on select object value

Posted on 2006-07-08
3
581 Views
Last Modified: 2013-12-24
I'm trying to hide/show the contents of a span based on the value of a cfselect object (dropdown menu) which is called "Interval".  I'm using ColdFusion and JavaScript.

The objects and spans on the page are dynamically named because the page displays multiple records that can updated all at once.  Each record has its own "Interval" dropdown menu.  I've named these Interval cfselect controls "Interval#ServiceItems.ClientServiceID#.  There are several spans per record, each named "Day#ServiceItems.ClientServiceID#", "Week#ServiceItems.ClientServiceID#", "Month#ServiceItems.ClientServiceID#", etc.  

When a user changes the value of a dropdown named "Interval555" to "Day", I want to display the contents within the Day555 span... some Day-specific text boxes, etc.  When the user selects "Month",... same thing: hide the Day555 span and show the Month555 span.  The same thing for the record right below -- When a user changes the cfselect named Day556 to "Week", show the contents of the span named "Week556" and hide the other -556 spans.

It seems like a simple Java function could account for the Interval chosen (Day, Week, etc) and the current record ID (CSID) and show/hide the related spans accordingly.  

I'm not very experienced with Java, as you can tell.  Any help is hugely appreciated.  Also, I'm not bent on using spans... if you think a <div> is better, that's cool.  

Thanks in advance for any help!

-Bill


<SCRIPT language="JavaScript">
     function ToggleVisible(Interval, CSID)
     {      
       ???
     }
0
Comment
Question by:tmangoldcpa
  • 3
3 Comments
 
LVL 25

Expert Comment

by:James Rodgers
ID: 17075434
funtion hideAll(){
 var collectionSpan=document.getElementsByTagName('span')
for (x=0;x<collectionSpan.length;x++){
collectionSpan[x].style.display='none';
}
}

function showSelected(objShow){
hideAll()
document.getElementById(objShow).style.display='block';
}

and in the select

onClick='if(this.selectedIndex){ showSelected(this.options[this.selectedIndex].value)} else{hideAll()};'

where the value of the selection is the name of the span you want to show.

<option value="week555">Week 555</option>
0
 
LVL 25

Accepted Solution

by:
James Rodgers earned 500 total points
ID: 17075442
on the fly, might need to debug
0
 
LVL 25

Expert Comment

by:James Rodgers
ID: 17107374
glad i could help

thanks for the points
0

Featured Post

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Have you ever sent email via ColdFusion and thought of tracking this mail to capture the exact date and time when the message was opened ?  If yes, then this article is for you ! First we need a table user_email with columns user_id , email , sub…
Meet the world's only “Transparent Cloud™” from Superb Internet Corporation. Now, you can experience firsthand a cloud platform that consistently outperforms Amazon Web Services (AWS), IBM’s Softlayer, and Microsoft’s Azure when it comes to CPU and …
Microsoft Active Directory, the widely used IT infrastructure, is known for its high risk of credential theft. The best way to test your Active Directory’s vulnerabilities to pass-the-ticket, pass-the-hash, privilege escalation, and malware attacks …

838 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question