How to align the "options" to the "select" of kendo dropdownlist?

Question

I'm using the kendo ui dropdownlist and I noticed that the options do not align with the select when the select is cut off from the viewport. This is what happens:

Is there any way to make the options align with the select in this scenario? I want the options to be cut off from the screen also.

Thank you!

PS: The kendo dropdown can be seen here: http://demos.kendoui.com/web/dropdownlist/events.html

Answer 1

Well - it's not a bug, it's a feature.

You'd have to rewrite the _position method in the Popup widget (kendo.ui.popup).

Alternative: I came across this in another context; you can prevent the dropdown from changing position by setting kendo.ui.Popup.fn.options.collision to false (this will affect all widgets which use Popup):

kendo.ui.Popup.fn.options.collision = false;

var data = [{
    text: "Item1",
    value: "1"
}, {
    text: "Item2",
    value: "2"
}, {
    text: "Item3",
    value: "3"
}];

$("#dropdownlist").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: data
});

(demo)