Apply Client-side Logic to Initially Hidden Controls

AUTHOR: Veselina Raykova

DATE POSTED: November 24, 2018

DESCRIPTION

The client-side object of a control is not created when its Visible=”False” property is set, thus any client-side logic executed when the page is loaded will not affect the control (e.g., built-in functions overrides). There are several ways in which this scenario can be handled, depending mainly on the moment when the control is shown (Post Back or partial AJAX update).

• Handle the OnClientLoad event of the hidden control
• Place the script inside the not visible container
• In case of AJAX – wrap the script in RadScriptBlock

 

SOLUTION 1: Handle the OnClientLoad event of the hidden control

The OnClientLoad event of each control inside the UI for ASP.NET AJAX suite is triggered when the client-side object of the control is created. With that said, the logic placed inside the handler of the Client load event of a hidden control will be executed immediate after the control is shown.

For example:

 

SOLUTION 2: Place the script inside the invisible container (shown on PostBack)

When the script is placed inside an initially hidden container, it also will be executed once the container is shown. If you are changing the visibility of the control on full PostBack, adding the script directly inside the hidden panel would suffice:

For example:

 

SOLUTION 3: Place the script inside the invisible container (shown on PostBack)

In case you want to wrap the script inside a container, that will be shown on a AJAX call, though, you will need to wrap the added client-side logic inside RadScriptBlock (or in some cases - RadCodeBlock):

 

SEE ALSO

RadCodeBlock and RadScriptBlock