Decorated Dropdown issues

[Ed Lance]

1.  I have Dropdown controls that get styled with the decorator.  When the user clicks on the down button, the dropdown list expands, but then clicking the button again will not contract the list.  This is breaking the correct operation of the dropdownlist.

<asp:DropDownList ID="AddressDropDownList" runat="server" DataSourceID="AddressSqlDataSource" DataTextField="adrFullname" DataValueField="adrIdx" AppendDataBoundItems="True" AutoPostBack="True">
    <asp:ListItem Value="" Text="--All--"></asp:ListItem>
</asp:DropDownList>

2.  The styling doesn't match a RadCombo on the same form.  The RadCombo has the text box area shaded, the dropdownlist doesn't.  Makes it pretty obvious where one or the other was used and provides inconsistent UI.  Is there a way to get them to match?

<telerik:RadComboBox ID="xrcarCarIdxRadComboBox" runat="server" DataSourceID="CarrierListSQLDataSource" DataTextField="carName"
    DataValueField="carIdx" SelectedValue='<%# Bind("xrcarCarIdx") %>' Width="300" HighlightTemplatedItems="true">
    <ItemTemplate>
        <asp:Label runat="server" ID="CarrierListLabel" >
            <b><%# Eval("carName") %></b><br /><%# Eval("carAddress")%><br /><%# Eval("carCSZ")%>
        </asp:Label>
    </ItemTemplate>
</telerik:RadComboBox>

In the master page:

<telerik:RadFormDecorator ID="FormDecorator1" runat="server" DecoratedControls="all" >
</telerik:RadFormDecorator>

[Danail Vasilev]

Hi,

I have tested you scenario (ASP Dropdown with RadFormDecorator) and everything seems to be fine on my side. You can watch a short video here. You can also make a test on our online demos. If you are having the unexpected behaviour on the online demos, could you confirm the browser and its version under which you are having the issue? If the online demos are working as expected that means the issue may come from your project.

In that case one of the reasons for your issue could be due to some of the CSS on your page. You can try removing all the CSS from the page and if this fixes your issue then try to isolate the problematic CSS rule. Also, can you confirm there aren't any JavaScript errors on your page and if there are - does resolving them alleviate the situation? If neither of these approaches helps could you try to reproduce the issue with the VS sample I have sent, and after that tell us what you have amended? For the sample I have used the Northwind.mdf database, as I do not have yours. You can find it in your installation folder of the demos.

Regarding your second question, RadComboBox is not affected by the RadFormDecorator, as it has its own Skins. Therefore in order to set the RadComboBox fit visually with your page you can choose the proper Skin through Skin property of RadComboBox. If that is not your scenario,however, could you please, describe in a more detailed way what exactly is  the inconsistency of the UI of the RadComboBox?

Regards,
Danail Vasilev
the Telerik team

[Ed Lance]

Danail,
Interesting attempt, however you did not test in the video what I am talking about.  Go to your own demo here: http://demos.telerik.com/aspnet-ajax/formdecorator/examples/overview/defaultcs.aspx Find the dropdown list (with Select1 as the value).  Click the down arrow of the dropdown list.  Notice that the list expands.  Now, click the down arrow again.  This should collapse the list.  But it doesn't.  This happens in IE9 and latest Firefox.

Now, in the Select Decorated Controls radio, select None.  You see the form refresh with the controls not decorated.  Click the dropdown list's down arrow, the dropdown expands.  Click the down arrow again and the list collapses.  That is the correct behavior of a combo box/dropdown list.

As for the skins, I don't think me describing it again is going to help.  Look at your own demo that you provided.  Notice that the decorated dropdown list and the radCombobox don't look the same?  Try other skins as well.  My expectation is that they would be the same, regardless of which way they look.

My question remains, is there a way to get them to match?

thanks

[Danail Vasilev]

Hello,

Thank you for the clarification.

The disfunction of the collapsing of the decorated dropdown is a bug and it has been logged in our feedback portal here, so you can monitor, comment or vote on it. I have updated your Telerik points as well for the report.

Regarding your second question about the inconsistency of the UI between  the decorated ASP Dropdown and the RadComboBox, our Front-End developers have been informed about that. The point is that we have recenlty upgraded to Sass styling and not all changes have been applied.

For the time being you can apply the following custom styles:

<style type="text/css">
    .RadForm_Default .rfdSelect_Default,
    .RadForm_Default .rfdSelect_Default:hover,
    .RadForm_Default .rfdSelect_Default .rfdSelectOuter,
    .RadForm_Default .rfdSelect_Default:hover .rfdSelectOuter,
    .RadForm_Default .rfdSelect_Default .rfdSelectArrow span,
    .RadForm_Default .rfdSelectBox_Default .rfdSelect_selected,
    .RadForm_Default .rfdSelectBox_Default li:hover,
    .RadForm_Default .rfdSelect_Default.rfdSelectDisabled:hover,
    .RadForm_Default .rfdRtl .rfdSelect_Default,
    .RadForm_Default .rfdRtl .rfdSelect_Default:hover,
    .RadForm_Default .rfdRtl .rfdSelect_Default .rfdSelectOuter,
    .RadForm_Default .rfdRtl .rfdSelect_Default .rfdSelectOuter:hover
    {
        background-image: url('../Pics/ComboSpritesCustom.gif') !important;
    }
</style>

along with the sprite which is attached to the current mail.

If you have any other questions or suggestions about our products, do not hesitate to contact us again.

Kind regards,
Danail Vasilev
the Telerik team