Menu
I'm having a strange issue with asp.net enabled state of radiobutton.
Code in .aspx page :
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="testradioButton.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#radYes').change(function () { gererEtat(); });
$('#radNo').change(function () { gererEtat(); });
});
function gererEtat() {
$('#radDisabledYes').prop('disabled', !$('#radYes').prop('checked'));
$('#radDisabledNo').prop('disabled', !$('#radYes').prop('checked'));
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:radiobutton ID="radYes" runat="server" GroupName="test" Text="yes"></asp:radiobutton>
<asp:radiobutton ID="radNo" runat="server" GroupName="test" Text="No"></asp:radiobutton>
</div>
<div>
<asp:radiobutton ID="radDisabledYes" runat="server" GroupName="test2" Text="yes"></asp:radiobutton>
<asp:radiobutton ID="radDisabledNo" runat="server" GroupName="test2" Text="No"></asp:radiobutton>
</div>
<asp:LinkButton ID="lnktoto" runat="server" Text="Submit"></asp:LinkButton>
</form>
</body>
</html>
And Code Behind :
Public Class WebForm1
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
radDisabledYes.Enabled = radYes.Checked
radDisabledNo.Enabled = radYes.Checked
End If
Stop
End Sub
Private Sub Radiobutton1_CheckedChanged(sender As Object, e As EventArgs) Handles radYes.CheckedChanged, radNo.CheckedChanged
radDisabledYes.Enabled = radYes.Checked
radDisabledNo.Enabled = radYes.Checked
End Sub
Private Sub lnktoto_Click(sender As Object, e As EventArgs) Handles lnktoto.Click
Stop
End Sub
End Class
On server side, I disable radio buttons on first load. I have the same conditions in javascript. So on client side, if user click Yes, I enable some controls. I do the same on server side. It works great with all type of controls except Radio Button.
Let say that on load, I disable radio buttons. On client side, base on user input, I enable them (in javascript). User checked a radio button and submit page. On server side, the radio button is disabled and unchecked. I have code that check the conditions and enable it. But the radio button is still not checked. I understand why, the server ignore the checked state because at first, it think it is disabled. Is there a way to make this work? I know the server is receiving the checked state because when I check Request.Form, I see radDisable=Yes.
Thanks for your help.
662
Here is the hack you are looking for :)
Public Class WebForm1
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If radYes.Checked Then
radDisabledYes.InputAttributes.Remove("disabled")
radDisabledNo.InputAttributes.Remove("disabled")
Else
radDisabledYes.InputAttributes("disabled") = "disabled"
radDisabledNo.InputAttributes("disabled") = "disabled"
End If
Stop
End Sub
Private Sub Radiobutton1_CheckedChanged(sender As Object, e As EventArgs) Handles radYes.CheckedChanged, radNo.CheckedChanged
' not really needed anymore, but lets leave it in here for fun!
End Sub
Private Sub lnktoto_Click(sender As Object, e As EventArgs) Handles lnktoto.Click
Stop
End Sub
End Class
This essentially bypasses .NET's safety check regarding disabled controls. The controls are still enabled/disabled appropriately, but you are doing so without messing with the WebControl.Enabled property.
70
$(document).ready(function () {
$('#<%=radYes.ClientID%>').change(function () { gererEtat(); });
$('#<%=radNo.ClientID%>').change(function () { gererEtat(); });
function gererEtat() {
$('#<%=radDisabledYes.ClientID%>').prop('disabled', !$('#<%= radYes.ClientID%>').prop('checked'));
$('#<%=radDisabledNo.ClientID%>').prop('disabled', !$('#<%=radYes.ClientID%>').prop('checked'));
}
});
Use 'ClientID' for your control selection in jquery code because control is server control.
23
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
