242
Views
7
Comments
Solved
Javascript getElementsByClassName or getQuerySelectorAll not getting all element
Application Type
Reactive

Hi All,

I am creating a custom drag and drop functionality using vanilla js, which is working fine except with the elements that has a class name of 'dragitem' aren't being retrieve.

I've put the js code on OnRender event.

The page has 15 total elements to retrieve, but getElementsByClassName or getQuerySelectorAll can only get 6 elements. Seems like, the js code runs before all the elements are being rendered.

Thanks!

2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Esrom,

It's something to do with the List Widget disable-virtualization property. Set the disable-virtualization property value to True as shown below.

See this sample screen: Drag&Drop

I hope this helps you!


Kind regards,

Benjith Sam

2023-12-18 00-35-37
Mohammed Ezzarfani

Have you tried the OnReady event

UserImage.jpg
Esrom Galang
Yes, and everything cannot be be retrieved on OnReady.
2023-12-18 00-35-37
Mohammed Ezzarfani
UserImage.jpg
Esrom Galang
DragAndDrop.oml
2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Esrom,

It's something to do with the List Widget disable-virtualization property. Set the disable-virtualization property value to True as shown below.

See this sample screen: Drag&Drop

I hope this helps you!


Kind regards,

Benjith Sam

UserImage.jpg
Esrom Galang

This works like magic. Thanks, Benjith. May I know the purpose of that?

Thanks!

2021-03-18 21-03-15
Benjith Sam
 
MVP

You're welcome, Esrom. Glad to help you :)

Sorry! To be honest, I don't know what exactly happens under the hood because of virtualization, but as per my understanding, the List virtualization concept is related to the List scroll experience. Maybe because of it being enabled by default, it delayed the complete list item rendering (based on the dynamically computed threshold value).

Related documentation doesn't explains much about this. Still you can have a look to this link Designing_Screens/List


Kind regards,

Benjith Sam 

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.