Solved

.NET 2.0 C# VS make dropdownlist visible/invisible via radio button control (client side)

Posted on 2006-07-17
8
702 Views
Last Modified: 2010-08-05
I have a radiobuttonlist with 2 choices,  "car" or "truck".

If "car" is selected, I want 2 different dropdownlists (dd1 and dd2) to appear!

However if " truck" is selected, I want dropdownlist (dd3) to appear and dd1 and dd2 to disappear.

The opposite is true if "car" is selected, dd3 will disappear and dd1 and dd2 will appear again.

When the web page first appears,  dd1, dd2 and dd3 dropdownlists are all invisible and radiobuttonlist is not selected ?

Need something simple.

Thanks for help here.
0
Comment
Question by:RSSIAdmin
  • 4
  • 2
  • 2
8 Comments
 
LVL 7

Assisted Solution

by:whityum
whityum earned 250 total points
Comment Utility
turn on autopostback for the rbl, have a function for onselectedindexchanged, and say
if(rbl.SelectedValue == "car"){
dd1.Visible = true;
dd2.Visible = true;
dd3.Visible = false;
}else{
dd1.Visible = false;
dd2.Visible = false;
dd3.Visible = true;
}
0
 
LVL 7

Expert Comment

by:whityum
Comment Utility
also have visible = false in the tag on the aspx page.
0
 
LVL 35

Accepted Solution

by:
mrichmon earned 250 total points
Comment Utility
Well the above while simple, is not user freidnly as it submits the page each time the user changes a radio button, so then you have to deal with scroll isuues, etc.

Better is to have all have the Visible=true and allow javascript to select which show up on the screen.

The javascript would look like:

function updateDDLs()
{
    if(rbl[0].checked)
    {
        dd1.style= "";
        dd2.style= "";
        dd3.style= "display:none;";
     }
    else if(rbl[1].checked)
    {
        dd1.style= "display:none;";
        dd2.style= "display:none;";
        dd3.style= "";
     }
   else
    {
        dd1.style= "display:none;";
        dd2.style= "display:none;";
        dd3.style= "display:none;";
     }
}

Then the drpdowns look need to start out with style="display: none;" and need an onChange="updateDDLs();" attribute.

Then it will dynamically update without submitting/reloading the page each time the user makes a change.
0
 
LVL 7

Expert Comment

by:whityum
Comment Utility
he will have to get the client IDs of the drop downs if he does it that way.
0
IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 

Author Comment

by:RSSIAdmin
Comment Utility
mrichmon ---

Thanks so much for the input. (both look good!)  The Javascript would save round trips

Does above show all the code I will need to get this  to work. For example do I need some kind of pointer or  reference  to rb1[0] and rb2 etc.  like form.document.rb1.. etc  ?  what is style?

function updateDDLs()
{
    if(rbl[0].checked)
    {
        dd1.style= "";
        dd2.style= "";
        dd3.style= "display:none;";
     }


Help, Tom
0
 
LVL 7

Expert Comment

by:whityum
Comment Utility
.Net assigns an ID you can access via the ClientID property, e.g. rbl.ClientID.ToString()

you would have to build the javascript string dynamically, like
string s = "if(document.form[0]." + rbl.ClientID.ToString() + ".checked == true){";
s += "{";
s += "document.form[0]." + dd1.ClientID.ToString() + ".style = 'display: inline';"
....

and register the script to the page




0
 
LVL 35

Expert Comment

by:mrichmon
Comment Utility
Yes.

It would be

document.getElementById("rbl")[0].checked
for the radio button.

Basically you use document.getElementById("ID of control")

This works for the ID you assign from the asp page as long as it is not repeated in a repeater.
0
 

Author Comment

by:RSSIAdmin
Comment Utility

Thanks so much for the answer to my questions.

Tom
0

Featured Post

Enabling OSINT in Activity Based Intelligence

Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

Join & Write a Comment

IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
Introduction This article shows how to use the open source plupload control to upload multiple images. The images are resized on the client side before uploading and the upload is done in chunks. Background I had to provide a way for user…
Sending a Secure fax is easy with eFax Corporate (http://www.enterprise.efax.com). First, Just open a new email message.  In the To field, type your recipient's fax number @efaxsend.com. You can even send a secure international fax — just include t…
Excel styles will make formatting consistent and let you apply and change formatting faster. In this tutorial, you'll learn how to use Excel's built-in styles, how to modify styles, and how to create your own. You'll also learn how to use your custo…

744 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

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now