Open Dropdownlist on focus.

[Gurarpan]

Hi ,

I am using Telerik MVC dropdownlist and I want to open dropdownlist when it get focus.

I found similar property in telerik rad dropdownlist but not in mvc dropdownlist.

Or

Dropdown should changed color on getting focus.



Could you suggest some Idea.

[Georgi Tunev]

Hi Gurarpan,

You can do it like this:

   <%= Html.Telerik().DropDownList()
.Name("DDL1")
   .ClientEvents(events => events.OnLoad("openOnFocus"))
       .Items(item =>
       {
           item.Add().Text("Item1").Value("1").Selected(true);
           item.Add().Text("Item2").Value("2");
           item.Add().Text("Item3").Value("3");
       })

   %>
   <script type="text/javascript">

       function openOnFocus() {
           var ddl = $(this);

           ddl.closest(".t-widget").focus(function () {
               ddl.data("tDropDownList").open();
           });

       }
   </script>

Regards,
Georgi Tunev
the Telerik team

[Gurarpan]

Hi Georgi,

Thanks for your response.

Below code is working fine. But my dropdownlist is not getting open when I click on it.

I tried to combine the code like below still click event is not working.

Any Idea.

function openOnFocus() {

           var ddl = $(this);

 

           ddl.closest(".t-widget").focus(function () {

               ddl.data("tDropDownList").open();

           });
            
                ddl.closest(".t-widget").click(function () {

               ddl.data("tDropDownList").open();

           });

 

       }

[Georgi Tunev]

Hello Gurarpan,

Try calling the open() method with a timeout:

function openOnFocus() {

    var ddl = $(this);

    ddl.closest(".t-widget").focus(function () {
        window.setTimeout(function () {
            ddl.data("tDropDownList").open();
        });
    });

}

All the best,
Georgi Tunev
the Telerik team