Cascading DropDownList fill using DAL

I have a DAL (data access layer) that is feeding a few cascading ASP.NET DDL (DropDownLists) using a DataReader and Stored Procedures.

When a user selects an item:


A different DDL is filled with data


Each list item of all DDLs immediately displays its image in a shared ImagePlaceHolder when selected by the user. The current image replaces the previous image.
Hope you can help, thanks.
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Bob LearnedCommented:
What is your question?
mitdanielsAuthor Commented:
How do I do this using C# ASP.NET in a web application?
Bob LearnedCommented:
Are you using the CascadingDropdown controls from the AJAX Control Toolkit, or the standard ASP.NET DropDownList controls?  

Are the images coming from file, database, ...?

How much detail do you need to figure this out?
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

mitdanielsAuthor Commented:
I am using standard ASP.NET DropDownLists, the images' name (imagename.jpg) is coming from the database, so just a string.

I need to know how you would fill the DDL via the stored procedure, especially given that I am using a DAL, so a new custom database object gets instantiated on the mypage.aspx.cs page and take it from there. I don't want to use the ObjectDataSource or any automated type tool, just simple classes and objects. I am using a DataReader, no Dataset or any of its features.

How many different stored procedures do you use and why would be helpful.

The main section of interest though is how you'd go about getting the DDLs and images to work well.
Bob LearnedCommented:
Will the DropDownList have a display and a value, like Display=Washington, and Value=WA?  Will you select the DropDownList, and use the "value" to determine which file name to display?  You can build a list of business objects, or a list of KeyValuePair<string, string>, and then bind the DropDownList's DataTextField and DataValueField to the matching properties.
mitdanielsAuthor Commented:
I am not sure whether this will answer your question, but the values from each DDL are not unique to each list, so you could have the same value in the next list.

The images to display are a result of either a single or combination of previous DDL selections.

The first DDL will have say 5 colors, and each will have an image of its own to display. The first list will also fill another list with company names and each of those when selected will have an image to display. In addition, the first list will fill another list with colors, and each of them will do the same as the first DDL.

This goes down a few levels, but if I can see how the first two levels could work, the rest will not be a problem.
Bob LearnedCommented:
Within a single DropDownList, you need unique values.  Across multiple DropDownList controls, you can have duplicate values.

Can you show me an example of the display text and values for each DropDownList in the cascade?
mitdanielsAuthor Commented:
Yes, unique in a single DDL, but the other DDLs could have some of the same values. They're just colors (black, white, red, blue, gold, dark blue, etc...). The display is only the image, and the values into DDLs. The company name DDL values are company names (Microsoft Inc, Apple, Wendys, AAA, etc...).
Bob LearnedCommented:
Something like this, where you take each selection and make up an image file name for an <asp:Image> control?

DDL #1
Dark Blue

DDL #2

Image files
Blue Microsoft.jpg
Black Apple.jpg
Red AAA.jpg
mitdanielsAuthor Commented:
Yes, so when DDL #1 is loaded, the first value is automatically selected (Black in your example), and the companies related to "Black" would be loaded automatically into DDL #2, and the first selected value of DDL #2 (Blue Microsoft.jpg in your example) would have its image display in an <asp:Image> control on the same page. So each listed company would have a related image displayed when selected.

Remember that another DDL is filled with the next level of colors, and this DDL would do the same thing DDL #1 has done when the user selects any of its colors (values).

In some cases DDL#1 would not have a list of companies related to it, so there would be an empty DDL#2, and an image placeholder would display in the same <asp:Image> control.  saying something like "No image to display". However it definitely has a valid image at one of the levels lower down, and this depends on the color combination found in the database.

Keep in mind that you'll have color DDLs (representing levels / color combinations), just 1 DDL for listing companies (fill the same one with new data at each color level)  and just 1 <asp:Image> control that displays 1 image at a time.

Each company has a specific image that is unique to it, like a logo for example.
Bob LearnedCommented:
DropDownList #1 selection is a filter criteria for DropDownList #2.  When you select a value for DropDownList, then display an image...

Attach an event handler to the DropDownList2.SelectedIndexChanged event.  Determine the selected value from DDL #1 and DDL #2, and use that to generate a file  name for the Image control.  Make sure that DDL2.AutoPostBack = true.
mitdanielsAuthor Commented:
Sorry for the delay, been busy moving.

I think it might be better if I were to ask specific questions and award your points based on that.

I've already done everything we've discussed before posting this "question", so it feels like we're going over unnecessary things, though it might be important information that will help you understand what I am doing.

So I still have the problem of trying to make a cascading dropdownlist work effectively, and to make things easier, I'll ask this specific question, and award points accordingly:

The default Visible property of each, but the first, dropdownlist is set to false, and as each related Color DDL, Company DDL, and Image control is filled, their Visible property is set to "True", as one might expect.

This occurs for the various levels between 1 and 4 levels. The problem is that if for example all 4 DDLs levels are now visible due to valid selections, the user can now decide to select what happens to be just a 2 level color scheme, and thereby leaving 2 visible DDLs that are irrelevant to the current 2 level selection.

I am not sure at which point I should set the DDLs visibility property False again. Since I won't know what the user will do after the DDLs are visible, there has to be a point at which I can set all DDLs visibility property to false if the user decides on a new set of selections irrespective from which DDL level the user decides to make a new selection.
Bob LearnedCommented:
So, you are asking for a logic flow, rather than a coding question...

I believe that you are describing a scenario that I usually see with product selectors, like this one:

1) Select Make from first drop-down

2) Show the Year drop-down.  

3) Select the Year

4) Show the Model drop-down

If you select a different Make, the page hides the Model drop-down, and resets the Year drop-down to "Select a Year".  This is the way that I see as the expected behavior for cascading drop-downs.

Have you looked at the CascadingDropDown controls that come with the AJAX Control Toolkit?

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
mitdanielsAuthor Commented:
Initially this task looked very easy, but it turns out that there is a high degree of complexity to overcome with this particular set of dropdownlists and data.

I'll have to take your advice and look at other websites and also perhaps see how they do it with Ajax.

Thanks for your time and effort, appreciate it.
mitdanielsAuthor Commented:
Thanks again!
Bob LearnedCommented:
I find that browser developer tools really help your detective work, especially what you get with Google Chrome, since they can really help you examine the specifics about how a web site works.  Internet Explorer and FireFox also have developer tools.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.