124
Views
6
Comments
Solved
I need to know more about Id selector in JS.

Hello pros, i readed in document that we avoid to using Javascript to call Ids of elements, because Id of element would be change in runtime. But can i use JS to call to id of static element? 

...Tks you all so much!!!!!!

2024-07-05 14-16-55
Daniël Kuhlmann
 
MVP
Solution

Hi @Tony Dai Ka HD,

All the previous replies tell only a part of the story, so let me try to be as complete as possible here to explain how to access an element by Id in Javascript in OutSystems.

You should never directly an element by its widget id through a string literal.

The widget Ids are always automatically generated, and why you change your screen block design the generated Ids can differ on the next publish.

If you need to access in JavaScript an element displayed on your screen or block you need to set the container Name property. 

This will make the Widget.Id property available for you to use. The Widget.Id property contains the by OutSystems generated Id of widget or container element. 

You can pass this as an input parameter to a JavaScript widget in your screen action

 and use it to access the HTML element in JavaScript.

Regards,

Daniel

2021-09-06 15-09-53
Dorine Boudry
 
MVP
Solution

Hi @Prince Aadil Khan Panwar

this is incorrect, Outsystems does not guarantee this, you need to use the Element.Id special variable that is available to you in the code, never the name itself.

@Tony Dai Ka HD  , 

when you name an element in your canvas, 

you will have available the id, 

For Reactive :

pass the id variable into your javascript node as a text attribute, 

and you can use that in for example a getElementByID().

For Traditional Web :

refer to your id variable inside for example a RunJavascript server action:


Dorine

2024-05-08 06-29-37
Prince Aadil Khan Panwar

Oh thanks @Dorine Boudry for the knowledge. But I tried this way n worked all the time. 

2024-05-08 06-29-37
Prince Aadil Khan Panwar

Hi Tony Dai Ka HD,

When you give any name to any container or element from the canvas in screen. System will consider it as id

Document.getElementById() use the name as id which you have given to the element with #

Hope this helps

Thanks 

Prince

2024-05-15 07-07-20
Thinh Du

But is it safe to use js to call those id sir? 

I mean id of static element...

Tks for your reply, Have good day!

2021-09-06 15-09-53
Dorine Boudry
 
MVP
Solution

Hi @Prince Aadil Khan Panwar

this is incorrect, Outsystems does not guarantee this, you need to use the Element.Id special variable that is available to you in the code, never the name itself.

@Tony Dai Ka HD  , 

when you name an element in your canvas, 

you will have available the id, 

For Reactive :

pass the id variable into your javascript node as a text attribute, 

and you can use that in for example a getElementByID().

For Traditional Web :

refer to your id variable inside for example a RunJavascript server action:


Dorine

2024-05-08 06-29-37
Prince Aadil Khan Panwar

Oh thanks @Dorine Boudry for the knowledge. But I tried this way n worked all the time. 

2024-07-05 14-16-55
Daniël Kuhlmann
 
MVP
Solution

Hi @Tony Dai Ka HD,

All the previous replies tell only a part of the story, so let me try to be as complete as possible here to explain how to access an element by Id in Javascript in OutSystems.

You should never directly an element by its widget id through a string literal.

The widget Ids are always automatically generated, and why you change your screen block design the generated Ids can differ on the next publish.

If you need to access in JavaScript an element displayed on your screen or block you need to set the container Name property. 

This will make the Widget.Id property available for you to use. The Widget.Id property contains the by OutSystems generated Id of widget or container element. 

You can pass this as an input parameter to a JavaScript widget in your screen action

 and use it to access the HTML element in JavaScript.

Regards,

Daniel

2024-05-15 07-07-20
Thinh Du

You guys save my life!!! Love u all 💗

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