I have a asp:Wizard control and asp:RadioButtonList in first WizardSteps out of two WizardSteps. I want to get the Text and Value of the selected radio button from javascript but I am unable to get the result. I need someone's help. My code is as below:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WizardRadioButtonListDemo.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="jquery-3.2.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
var servieTypes = document.getElementById('<%=Wizard1.FindControl("rdoServiceType").ClientID%>');
$(servieTypes + ' input').click(function () {
var selectedText = $(this).text();
var selectedValue = $(this).val();
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Wizard ID="Wizard1" runat="server" DisplaySideBar="false">
<WizardSteps>
<asp:WizardStep ID="WizardStep1" runat="server" Title="Step 1">
<fieldset id="Fieldset1" runat="server">
<legend id="Legend1" runat="server">Type</legend>
<asp:RadioButtonList ID="rdoServiceType" RepeatLayout="Flow" runat="server">
<asp:ListItem Text="Gold" Value="0">Gold</asp:ListItem>
<asp:ListItem Text="Siver" Value="1">Silver</asp:ListItem>
<asp:ListItem Text="Premium" Value="2">Premium</asp:ListItem>
</asp:RadioButtonList>
</fieldset>
</asp:WizardStep>
<asp:WizardStep ID="WizardStep2" runat="server" Title="Step 2">
<fieldset id="Fieldset2" runat="server">
<legend id="Legend2" runat="server">User</legend>
<asp:Label ID="lblFirstName" runat="server" Text="First Name" AssociatedControlID="txtFirstName"></asp:Label>
<asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
<asp:Label ID="lblLastName" runat="server" Text="Last Name" AssociatedControlID="txtLastName"></asp:Label>
<asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
</fieldset>
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
</div>
</form>
</body>
</html>
My code behind file is as below:
using System;
namespace WizardRadioButtonListDemo
{
public partial class Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
rdoServiceType.SelectedIndex = 0;
}
}
}
}
This will work. You were close, but aspnet puts the RadioButton Text in a
labelnext to theinputelement. So it is not a KeyValuePair you can access with jQuery.