TwinCAT 3 HMI Tutorial JavaScript in UserControl

Here you can find out step by step how a JavaScript is embedded in a UserControl, one of three types of JavaScript applications (Action). Small important tricks for spelling and the way to documentaion.

[Fine_i_set_the_handle]

Thankyou so much for showing the chart with %i%' '%/i% etc. I cannot find this information absolutely anywhere within beckhoffs resources.

[klaswinberg]

Hello Oleg,

I'm trying to change the background color of a button in my TC Hmi using Javascript, and tried copying your code at 5:15, but I end up with the error:

"Failed to set property: 'BackgroundColor' of control: 'TcHmiButton'.Code: 160/0xa0, Message: E_VALUE_INVALID
Reason: Unable to convert value of type: string to type: for attribute property: BackgroundColor of control of type: with id: TcHmiButton.
Domain: TcHmi.System.ControlManager"

Any take on what I'm doing wrong?

My code: TcHmi.Symbol.writeEx("%ctrl%TcHmiButton::BackgroundColor%/ctrl%",
{
'color': 'rgba:(255, 0, 0, 1)'
}
);

[del-didiera-g]

Hi Oleg,
You are doing a very nice job...
Do you think if its possible to use usercontrol inside a pop up windows like face plate in Wincc ?
Thanks a lot

[praryboy]

Why does

work, but

does not?
I notice you add a "identifier" parameter to get the name of the control, is that the only way to get it? How are you populating that parameter?

[kamelkani]

Hi sir
Is frontend development useful in automation career like making HMIs and such !?
Should i learn it ( html css JavaScript ) ?!
And the music 🎶 is so cool hhh
Thank u