Hide dropdown box when ASP.NET dropdownlist is empty

Question

since I combined an asp:dropdownlist with an asp:checkboxlist, I have the problem in IE(8) and Firefox (Chrome works fine) that everytime I click the DropDownList, the empty box appears in addition to the popup I manually open when the dropdownlist is clicked.

My question now is: How can I hide this empty box (since there are no entries in it), but keep the dropdown element? I don't want to replace this component, since it still should look like a dropdownlist. If I change it to a text box it's not clear anymore that it can be used as a dropdown.

This is what I currently have in place:

<div style="width: 190px;" class="right">
    <!-- the original drop down list -->
    <asp:DropDownList CssClass="dropdownbox" ID="ddlCountry" runat="server">
    </asp:DropDownList>
    <cc1:PopupControlExtender ID="ddlCountry_PopupControlExtender" runat="server" DynamicServicePath=""
        Enabled="True" ExtenderControlID="" TargetControlID="ddlCountry" PopupControlID="pnlPopup"
        OffsetY="20">
    </cc1:PopupControlExtender>
    <!-- Popup control extender that maps the country list to the dropdown list -->
    <asp:Panel ID="pnlPopup" runat="server" CssClass="dropdowncheckbox">
        <!-- List of countries with a checkbox for each entry -->
        <asp:CheckBoxList ID="countryList" runat="server" 
            DataTextField="Countries" DataValueField="Countries" AutoPostBack="True"
            OnSelectedIndexChanged="countryList_SelectedIndexChanged">
        </asp:CheckBoxList>
    </asp:Panel>
</div>

If there is a component that fits my purpose better, please let me know. Thanks a lot in advance for your suggestions.

Dunno why @IrishChieftain deleted his answer - why indeed can't you disable the dropdown when it is empty? This way user won't be able to click it — Comfortably Numb
– Comfortably Numb, Commented Oct 24, 2013 at 15:51

Max · Accepted Answer · 2015-03-12 17:47:47Z

1

Place this code in the event you need to trigger the change This will work for c#

if(dropdownlist.Items.Count == 0)
{
dropdownlist.Attributes["style"] = "display: none;";
}
else
{
dropdownlist.Attributes["style"] = "";
}

answered Mar 12, 2015 at 17:47

Max

111 bronze badge

Sign up to request clarification or add additional context in comments.

Comments

IrishChieftain · Accepted Answer · 2013-10-24 15:35:51Z

0

Simply set the Drop Down List Enabled property to false and toggle it to true when it has entries.

dropdownbox.Enabled = false;

answered Oct 24, 2013 at 15:35

IrishChieftain

15.2k8 gold badges55 silver badges98 bronze badges

5 Comments

ArgisIsland Over a year ago

Thanks for your answer, but I don't want it to be disabled, since it should be clickable. When it's clicked, it loads the custom Popup I defined, but shouldn't load its own item list. Basically what I'm doing is faking the menu items with the popup. I just need the Dropdownlist to be there so that the user knows that it can be used as such. I can't use a textbox since several users will definitely not be able to figure out that it can be used like this... I'll try to update the question so that you can visualize it.

IrishChieftain Over a year ago

Why the need for the popup in the first place?

ArgisIsland Over a year ago

As mentioned in my last comment, I need something that looks like a dropdown menu, for user convenience and due to space limitations in the according area + some requirements that I can't change. I thought about using a multiselect list, but it couldn't be higher than 1 line, so I'm back to square 1. I'm very happy for other suggestions if there are other components that do the same thing. But for what I need (a dropdownlist with checkboxes for each entry), I couldn't find somethinge proper other than this.

IrishChieftain Over a year ago

You can't reinvent UI elements. My advice is to make room and use the drop down list as it's meant to be used :-)

ArgisIsland Over a year ago

Well I guess then I have to go with that approach since I'm running out of time, although it's a bit disappointing that there is no real DropDownCheckboxList :( Thanks for your answers anyway, I will however try to update this case if I find something better during my research.

TylerH · Accepted Answer · 2020-03-13 16:36:44Z

0

do something like this in c#:

if(dropdownlist.Items.Count == 0)
{
      dropdownlist.Visible = false;
}
else
{
      dropdownlist.Visible = true;
}

edited Mar 13, 2020 at 16:36

TylerH

21.3k84 gold badges84 silver badges122 bronze badges

answered Oct 25, 2013 at 7:20

Helmer

1262 bronze badges

1 Comment

ArgisIsland Over a year ago

Thanks for your answer, however the list needs to be clickable and visible when the menu is shown. In this case this wouldn't be possible anymore, I think.

TylerH · Accepted Answer · 2020-03-13 16:37:14Z

0

Encapsulate the dropdown in a div, give the div an id and the runat="server" property

Check in the code behind of the data to load the dropdown is empty set the div to visible false; if not, set the div to visible true.

edited Mar 13, 2020 at 16:37

TylerH

21.3k84 gold badges84 silver badges122 bronze badges

answered Oct 24, 2013 at 20:17

Juan

1,3921 gold badge15 silver badges20 bronze badges

Collectives™ on Stack Overflow

Hide dropdown box when ASP.NET dropdownlist is empty

4 Answers 4

Comments

5 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

5 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related