Appending a widget to something else than body + positioning issues

[Kristian]

Our widgets reside in a div that has positioned fixed, and it has a vertical scroll. When using an KendoDropDownList for example, it gets positioned correctly, until i scroll inside that div, since the dropdown list has it's position relative to < body >.

I've tried patching the kendoPopup.js (i think it's the right one?) like so:

line 73: options.appendTo = $($(options.appendTo)[0] || parentPopup[0] || $("#container") || BODY);
line 360: viewport = $("#container"),

This fixes the scrolling issue, but ONLY when the #container's scrollTop is at 0, if I scroll down a bit before i open a dropDownList, the position of the list goes in a negative direction, way off.

Is there any fix for this?

[Dimo]

Hello Kristian,

I am not sure what the problem is in your case, as the following scenario works as expected:

http://jsfiddle.net/dimodi/a5L8Y/

Generally, the positioning of the widget's dropdown depends on jQuery's calculations. If there is something wrong about them, the problem should be better addressed by the jQuery team (although we could patch our code too if the problem is not resolved).

Regards,
Dimo
the Telerik team

[Kristian]

Still the same problem. Let me explain in steps. (Use your example)

1. Scroll to the bottom of the #container
2. Click the dropdownlist so that the options are visible
3. Scroll the #container up (with your mouse, so you don't trigger any click events)

You now see that the options aren't "attached" to the dropdown itself.

[Dimo]

Hi Kristian,

I see. Well, in such cases you can close the dropdown in the page scroll event.

Greetings,
Dimo
the Telerik team