Question

Using jQuery I want to be able to click an element which will also checks it’s related radio button. I had this working fine until we had to add runat=”server” to the radio buttons.

When I apply this it prevents my jQuery function from working and I cant figure out how to get round it, heres a simplified version of the code:

HTML

<input type="radio" runat="server" id="sector1Radio" name="SectorGroup" title="Sector1" />

jQuery

$('#SomethingElse').click(function() {
    $('input[title=Sector1]').attr('checked','checked');
});

I’ve found out that when its converted to a .net control instead of checked=”checked” (as it would be usually) it is just Checked, so I changed that but on inspecting the DOM in multiple browsers, none of my radio buttons are being checked 🙁

Are there any other ways I can use jQuery to check a radio button that has runat=”server”?

Cheers!

Answer 1

I think that Your problem is that the id of the input is no longer sector1Radio but rather ctl00_sector1Radio or something similar. This happens if Your input control is inside e.g. a ContentPlaceHolder control (when using master pages).

Can You check the generated HTML code (in the browser) to verify if this is the case? What is the id of the input control?

If this is the case, You need to generate Your js jQuery code

$('#SomethingElse').click(function() {
  $('input[title=Sector1]').attr('checked','checked');
});

from codebehind so that SomeThingElse is replaced with the ClientID of the control.