control initial enabled state for ASP.NET dependant controls that are enabled/disabled by jQuery

Question

So far, I've seen (and I'm using the following) scripts to show/hide a div or other controls depending on another control in ASP.NET

$('[id$=myRadio_0]').click(function() { $('[id$=myDiv]').show(); });

$('[id$=myRadio_1]').click(function() { $('[id$=myDiv]').hide(); });

and of course, my div in html like

<div id="myDiv" runat="server" visible="false">

and that works fine when the user selects either option of the radiobuttonlist.

However, when I assign that radiobuttonlist a value of 1 or yes on my Page_Load on code behind, that isn't (and probably can't be) caught by jQuery, and my div remains invisible even though the control has a value of Yes/1.

So, do I need to set the visibility of that div from code behind, or is there a way in jQuery to force a scan of these dependencies after i've set the values for the main controls in code behind?

Answer 1

Couple of things you can do.

1) Change your div to a Panel server control (<asp:Panel id="myDiv" runat="server">), with the ID of "myDiv". Then in the code behind, when you set the radiobutton to 1, you can also set your panel control's visibility. Your current jQuery code will still work.

2) Write another line of jquery to test for div visibility when the page loads. Something like,

  if ($('[id$=myRadio_0]').val() == 1 && $('[id$=myDiv]:hidden')
  {
      $('[id$=myDiv]').show();
  }

Personally I'd go for option 1, since you're already dealing with setting up the state of your form in the codebehind, I wouldn't split the "setup" code into both the client and the server code.