ASP.NET RadioButtonList and Progresssive Enhancement

Question

I have a RadioButtonList which has AutoPostBack set to True and is being handled server-side:

<asp:radiobuttonlist ID="myRBL" OnSelectedIndexChanged="MyRBL_SelectedIndexChanged"
    RepeatDirection="Horizontal" AutoPostBack="True" runat="server">
    <asp:ListItem Selected="True">Choice 1</asp:ListItem>
    <asp:ListItem>Choice 2</asp:ListItem>
</asp:radiobuttonlist>

I want to "progressively enhance" this by adding a JavaScript function with the OnClick attribute. After adding OnClick="myFunction();", the serverside code is no longer called when JavaScript is disabled in the browser.

Has anyone got a way around this (do I have to implement the IPostBackEventHandler or am I missing something)?

UPDATE: 08-26-2010 4:31 p.m. Pacific

Apparently, the ASP.NET this control cannot submit with JavaScript disabled. Does anyone have a detailed solution to this?

Answer 1

The only way to check if the user has javascript enabled is from the client side.

Your best bet then is to add the function on the client side, rather than in the server code. jQuery handles this quite well, with something like:

$(function() {
  $('input[type=radio]').click(myFunction);
});

If you're not using jquery you can do a document.getElementById() and whatnot to assign the click handlers.

This way if the client doesn't have javascript, the radiobuttons are completely untouched.

Answer 2

AutoPostBack uses JavaScript to post back after clicking a radio button. By setting the onclick attribute, this behaviour is overwritten, so you must add an additional event handler to the click event.

As far as I know, there's no simple way to do this in plain JavaScript, so I would recommend using jQuery:

$('#radioButtonId').click(myFunction);