This is a migrated thread and some comments may be shown as answers.

DropDown of Radcombo doesnt collapse on RadWindow Behaviors(close,min,move)

7 Answers 318 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Tina
Top achievements
Rank 1
Tina asked on 11 Apr 2012, 01:16 AM
Hello Telerik,

In my application I have RadComboBox on my RadWindow.
My RadWindow has common behavior like min,max,close,move.
Now, when I open radCombobox on RadWindow and without clicking anywhere on the page when I Minimize or Move RadWindow, the dropdown is not collapsing nor moving along with RadWindow.Instead It is getting stuck on the same place.

Also, When DropDown is open and when I try to close RadWindow,the dropdown will not collapse or not getting hide.The dropdown portion of RadCombo will be seen on the aspx page.

I am setting these properties for RadWindow.

 public RadWindow()
        {
            this.Behaviors = WindowBehaviors.Close | WindowBehaviors.Minimize | WindowBehaviors.Maximize | WindowBehaviors.Move;
            this.Modal = true;
            this.EnableShadow = true;
            this.VisibleStatusbar = false;
            this.ReloadOnShow = true;
            this.ShowContentDuringLoad = false;
            this.ShowOnTopWhenMaximized = false;
        }

Am I missing Something for RadComboBox?

I have attached the pic here for your reference.

Thanks in advance
Tina


7 Answers, 1 is accepted

Sort by
0
Cat Cheshire
Top achievements
Rank 1
answered on 16 Apr 2012, 08:26 AM
You can handle the OnClientClose window event and close the combo dropdown:
function OnClientclose(sender, eventArgs)
{
   var combo = $find("<%= RadComboBox1.ClientID %>");
   combo.hideDropDown();
}
0
Tina
Top achievements
Rank 1
answered on 16 Apr 2012, 05:53 PM
Hi Cat,

Thanks for reply.As I said in my previous post that Dropdown is not getting collapsed on Window behaviors like minimize and move too. If I move my radwindow keeping Combobox open then dropdown is not moving along with Window.
and same with Window Minimize.If I minimize radWindow then in that case dropdown is not collapsing.

I understand that I can handle the OnClientClose window event and close the combo dropdown.But that will be just when I close the radWindow. Not for other behaviors of RadWindow.

I have attached screen shot for your reference. 

Please let me know if you have some other approach.

Thanks
Tina
0
Princy
Top achievements
Rank 2
answered on 17 Apr 2012, 10:45 AM
Hi Tina,

You can handle OnClientDragStart to close the dropdown while dragging and handle OnClientCommand to close the dropdown while minimizing.

ASPX:
<telerik:RadWindow ID="RadWindow1" runat="server"  OnClientDragStart="Comboclose" OnClientClose="Comboclose" OnClientCommand="Comboclose" >
   <ContentTemplate>
        <telerik:RadComboBox ID="RadComboBox1"  runat="server" >
                <Items>
                    ............
                </Items>
        </telerik:RadComboBox>
   </ContentTemplate>
</telerik:RadWindow>

JS:
<script type="text/javascript">
 function Comboclose(sender, args)
  {
    var combo = $find("<%= RadComboBox2.ClientID %>");
    combo.hideDropDown();
  }
</script>

Regards,
Princy.
0
Tina
Top achievements
Rank 1
answered on 17 Apr 2012, 06:44 PM
Hello Princy,

Thanks for your response.It seems to be a good option to handle combo close through Client-Side handlers but What if I have 50 Radwindows and in which I will have hundreds of combo box.Then I will end up writing hundreds of lines of code to just close combobox while moving or minimizing or closing radWindow.
This is a common functionality and it is expected that if we move RadWindow then RadCombobox should also move along with Window.
I hope Telerik have some solution for this issue.

Thanks
Tina
0
Ivan Zhekov
Telerik team
answered on 19 Apr 2012, 12:33 PM
Hello, Tina.

The drop down of the combobox is moved in the DOM of the parent document to ensure that it's always on top.

That said, if you rad windows shows external pages, the drop down will be in that external page, so when you move the window, the dropdown will move as well.

All the best,
Ivan Zhekov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Arun
Top achievements
Rank 1
answered on 22 Jun 2016, 10:16 AM

Hi Teleric,

I am also facing the same issue as Tina faced. Can you fix my issue. I am sharing my screenshots

To Tina-

  If you have fixed this issue please find me the solution

0
Marin Bratanov
Telerik team
answered on 22 Jun 2016, 11:16 AM

Hi Arun, Tina,

The easiest solution is to use an aspx page instead of the ContentTemplate because it will have its own context, being hosted in an iframe, just as Ivan suggested.

Otherwise, you can make the script more generic by getting the control reference from the DOM object: http://docs.telerik.com/devtools/aspnet-ajax/general-information/get-client-side-reference#using-plain-javascript-methods.

You can read more about this here: http://www.telerik.com/support/kb/aspnet-ajax/window/details/dropdown-does-not-move-or-close-with-radwindow.

Here is a generic example:

<script>
    function hideDropdowns(container) {
        $telerik.$(".RadComboBox", container).each(function (index, elem) {
            if (elem && elem.control && elem.control.hideDropDown) {
                elem.control.hideDropDown();
            }
        });
        $telerik.$(".RadDropDownList", container).each(function (index, elem) {
            if (elem && elem.control && elem.control.closeDropDown) {
                elem.control.closeDropDown();
            }
        });
    }
    function hideDropdownsFromEvent(sender, args) {
        var shouldCloseDropDowns = !args.get_commandName;
        if (args.get_commandName) {
            var command = args.get_commandName();
            shouldCloseDropDowns = (command == "Maximize") || (command == "Minimize") || (command == "Restore");
        }
        if (shouldCloseDropDowns) {
            hideDropdowns(sender.get_contentElement());
        }
    }
</script>
<telerik:RadWindow ID="RadWindow1" runat="server" VisibleOnPageLoad="true" OpenerElementID="Button1"
    OnClientClose="hideDropdownsFromEvent" OnClientDragStart="hideDropdownsFromEvent" OnClientCommand="hideDropdownsFromEvent">
    <ContentTemplate>
        <telerik:RadComboBox ID="RadComboBox1" runat="server" EmptyMessage="Open me and move/close the window" Width="250px">
            <Items>
                <telerik:RadComboBoxItem Text="one" />
                <telerik:RadComboBoxItem Text="two" />
                <telerik:RadComboBoxItem Text="three" />
            </Items>
        </telerik:RadComboBox>
        <telerik:RadDropDownList runat="server" ID="RadDropDownList1" Width="250px">
            <Items>
                <telerik:DropDownListItem Text="first" />
                <telerik:DropDownListItem Text="second" />
                <telerik:DropDownListItem Text="third" />
            </Items>
        </telerik:RadDropDownList>
    </ContentTemplate>
</telerik:RadWindow>
<asp:Button ID="Button1" Text="open the dialog" runat="server" />

Regards,

Marin Bratanov
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
ComboBox
Asked by
Tina
Top achievements
Rank 1
Answers by
Cat Cheshire
Top achievements
Rank 1
Tina
Top achievements
Rank 1
Princy
Top achievements
Rank 2
Ivan Zhekov
Telerik team
Arun
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or