How to override mobile style on DropDownList?

[SRV]

I am using a DropDownList with Kendo Mobile, and would like to override the mobile style when clicking the control. 

Now it get's style as the image to the left (mobile style), but I'd prefer the standard kendo style (right)

 

 

[Iliana Dyankova]

Hi Olaf,

There is no easy way to turn off the mobile styling of the DropDownList widget when it is used in a Kendo UI mobile application. Keep in mind that Kendo UI Mobile is targeting hybrid apps and is not designed to be used as a regular desktop site.

Regards,
Iliana Nikolova
Telerik

 

 

[SRV]

Thank you for the reply

[Marlon]

var deMobilizeDropDownLists = function(view) {
  //'view' is an instance of kendoMobileView that contains dropdownlist instances.
 //I typically call this from the 'init' event of the view.

$(".k-animation-container.km-popup.km-widget").removeClass("km-popup km-widget");
var dropdowns = $("[data-role='dropdownlist']");
      _.each(dropdowns, function(item){
        var comp = $(item).data("kendoDropDownList");
        if(comp && comp.popup) {
          comp.popup.bind("open", function(event){
            var elem = event.sender;
            event.sender.element.parent().removeClass("km-popup km-widget");
            if(event.sender.element.parent().hasClass("km-popup")) {
              //Prevent default open animation.
              //Then remove classes and open the popup programitcally
              //Easy peasy, Lemon squeezy
              event.preventDefault();
              event.sender.element.parent().removeClass("km-popup km-widget");
              setTimeout(function(){
                event.sender.open();
              },0);
            }
          });
        }
      });

 }

 

I created this hack to get that behavior. Hope it helps!