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

Dropdown list displays wrong position when scrolling the sub-page

3 Answers 830 Views
AutoCompleteBox
This is a migrated thread and some comments may be shown as answers.
Phat
Top achievements
Rank 1
Phat asked on 10 Apr 2014, 11:56 AM
Hi,
I'm working with AutoCompleteBox and have problem with dropdown list position.
I build a site with 2 nested Master Pages. As you see in attachment:
- One is marked Red, the container, fixed position.
- One is marked Blue (main content) is nested in the Red. The content in Blue is scrollable if it is too long.
I use AutoCompleteBox within the Blue.
The issue is that, after the dropdown list appears (see FirstAppear.png), I scroll down the Blue area. The dropdown list is not move along with the textbox, but seems to be fixed at the screen (see AfterScrolling.png)

View HTML source I see that the dropdown list is generated as <div>, placed as the first child of <form> element (wherever the AutoCompleteBox is)
I found is that <div> has position: absolute, but there is not parent tag has position: relative. Therefore, the <div> relates to the top-most <html> tag - Red Area, this area is not move when we scroll the Blue area up/down.
I think that's why we see the dropdown list not scroll up/down belong with the Blue area.

<html>
    <body>
        ...
        <form name="aspnetForm" id="aspnetForm"... >
             <div class="racSlide" style="left: 282.22px; top: 159.95px; ...">
             ...
             </div>
             ...
        </form>
        ...
    </body>
</html>


Please help to have investigation.
Thanks.

3 Answers, 1 is accepted

Sort by
0
Accepted
Magdalena
Telerik team
answered on 11 Apr 2014, 11:26 AM
Hello Phat,

Actually this is not a supported scenario. The dropdown of RadAutoCompleteBox is rendered outside of your wrappers as a first element in the form. Its position is set dynamically with javascript depending on the position of the RadAutoCompleteBox.
One possible workaround is to hide the dropdown by scrolling the wrapper.
Is it applicable for you?

Regards,
Magdalena
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Phat
Top achievements
Rank 1
answered on 14 Apr 2014, 10:47 AM

Magdalena,
I think hiding the dropdown by scrolling the wrapper will make a little inconvenience. If this is a unsupported scenario, we will accept it as a limitation.
we will keep following this. Please let me know if Telerik team has any update.

Thank you for your support.
Phat Nguyen

0
Ivan Zhekov
Telerik team
answered on 14 Apr 2014, 12:49 PM
Hi, Phat.

As of now this is indeed limitation because it's really hard to workaround the issue. Of course, if we do happen to find a workaround, we'll notify you here in this thread.

Regards,
Ivan Zhekov
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
AutoCompleteBox
Asked by
Phat
Top achievements
Rank 1
Answers by
Magdalena
Telerik team
Phat
Top achievements
Rank 1
Ivan Zhekov
Telerik team
Share this question
or