appsmith icon indicating copy to clipboard operation
appsmith copied to clipboard

Published 20 hours ago • verified publisher icon appsmithorg

[Bug]: Options of Select Field Inside JSON Form Displayed Incorrectly While Scrolling

Open ame-appsmith opened this issue 2 years ago • 2 comments

Is there an existing issue for this?

  • [X] I have searched the existing issues

Description

If there's a Select type of field in a JSON Form towards the bottom, the options menu either gets displayed outside the form or jumps into another position and gets misaligned when scrolling. This happens in both edit and deployed mode. appsmith2222

Steps To Reproduce

  1. Add a JSON Form with a Select field towards the bottom.
  2. Click on the Select field to open the options menu.
  3. Scroll up and down as shown in the attached loom recording.

Public Sample App

No response

Issue video log

https://www.loom.com/share/9890c15635024632ba3a1823d0216de0

Version

Cloud v1.8.7-SNAPSHOT

Front logo Front conversations

ame-appsmith avatar Nov 09 '22 21:11 ame-appsmith

To fix this for both Select and MultiSelect, We'd need to disable scrolling when the dropdown is opened. This is the same method we took for MultiSelect Widget and Menu button in Table Widget.

Just Observed there seems to be a regression on the Menu button in the Table Widget😂😂😂. https://github.com/appsmithorg/appsmith/pull/12199

But to solve these issues, we'd need to disable scrolling till the dropdown closes cc @dilippitchika

https://user-images.githubusercontent.com/31691737/206643809-dffbbe4c-3d04-4ad4-ac0b-49e7dc76e57d.mov

Tooluloope avatar Dec 09 '22 07:12 Tooluloope

Ok cool, looks like we need a decision for all popovers in widgets and how scrolling should behave then.

dilippitchika avatar Dec 09 '22 07:12 dilippitchika