CODEWITHSUNDEEP
jqueryasp.netasp.net-ajaxupdatepanel
DooDoo
DooDoo

Reputation: 13487

Change Radio Button selected item text during post back using jQuery

I have a Radio button list like this code in an update panel:

<asp:RadioButtonList ID="RadioButtonList1" runat="server" Width="233px" 
                ClientIDMode="Static" AutoPostBack="true" 
                onselectedindexchanged="RadioButtonList1_SelectedIndexChanged">
                <asp:ListItem Value="1">1</asp:ListItem>
                <asp:ListItem Value="2">2</asp:ListItem>
                <asp:ListItem Value="3">3</asp:ListItem>
                <asp:ListItem Value="4">4</asp:ListItem>
            </asp:RadioButtonList>

I want when user clicks on any item of this radio buttons a Please Wait... text show instead of radio button text.I write this code :

function pageLoad() {
        $(document).ready(function () {
            $('#RadioButtonList1').on("change", function () {
                $("#RadioButtonList1 input:checked").val("Please Wait...");
            });
       });
    }

but it does not work.Where is my mistake?

thanks

Upvotes: 4

Views: 1472

Answers (4)

Ram
Ram

Reputation: 144729

radio button values are not displayed on the browser viewport, you should use labels and change their texts:

   $(document).ready(function () {
            $('#RadioButtonList1').on("change", function () {
                $("#RadioButtonList1 input:checked").closest("label").text("Please Wait...");
            });
       });

Upvotes: 1

4b0
4b0

Reputation: 22323

try:

function pageLoad() {
        $(document).ready(function () {
            $('#<%=RadioButtonList1.ClientID %>').on("change", function () {
               $("#<%=RadioButtonList1.ClientID %>").find("input[checked]").val("Please Wait...");
            });
       });
    }

Upvotes: 0

DooDoo
DooDoo

Reputation: 13487

You should change this code:

$("#RadioButtonList1 input:checked").val("Please Wait...");

to

$("#RadioButtonList1 input:checked").parent().find('label').text("Please Wait");

Upvotes: 1

ianaldo21
ianaldo21

Reputation: 669

Leave out the function call and simply have this in your javascript code block:

$(document).ready(function () {
    $('#RadioButtonList1').on("change", function () {
        $("#RadioButtonList1 input:checked").val("Please Wait...");
    });

});

Upvotes: 0

Related Questions