<asp:RadioButtonList and onlick event

Posted on 2007-07-23
Last Modified: 2011-10-03

I have the following asp:

<asp:RadioButtonList  ID="PorRadioClass" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ToggleClassification" >
                                               <asp:ListItem Text="" Value="Existing"  ></asp:ListItem>
                                                    <asp:ListItem Text="" Value="New"></asp:ListItem>

I want to call a javascript function toggleOn when i click the existing radio and call javascript function toggleoff when i click the New radio. How can i do this?
Question by:Peewee
    LVL 12

    Expert Comment

    can you post back to a single subroutine that uses PorRadioClass.selectedItem.Value to call the appropriate function?
    LVL 1

    Expert Comment

    I live in code behind, so I will show you how there.  If ToggleOn/ToggleOff is not used by other controls, this works well.  However, if you are wanting to keep it in the page (not code behind), this isnt as helpful.

    Dim strScriptViewSite As String

    Select Case PorRadioClass.SelectedValue
      Case is = "Existing"
           strScriptViewSite = "<script>"
           strScriptViewSite += (what ever script ToggleOn does)
           strScriptViewSite += "</script>"
      Case is = "New"
           strScriptViewSite = "<script>"
           strScriptViewSite += (what ever script ToggleOff does)
           strScriptViewSite += "</script>"      
      Case Else
           strScriptViewSite = "<script>alert('You did not choose New or Existing.');</script>"
    End Select

    ClientScript.RegisterClientScriptBlock(Me.GetType, "ToggleScript", strScriptViewSite)

    end if

    LVL 5

    Author Comment

    I have created my javascript  in the ascx file. How do i associate script functions to my control PorRadioClass?
    LVL 1

    Expert Comment

    ok.. here is the Javascript version:

    <script language="javascript">
            function ToggleClassification() {
                var value1 = window.event.srcElement.value                        
                      if (value1 == "New")
                      if (value1 == "Existing")
            function toggleOn() {
                alert('Toggle On has been activated');
            function toggleOff(){
                alert('Toggle Off has been activated');

    Then your control will just call the ToggleClassification sub on the onClick event.  Depending on which IDE you are using, it will probably have an indicator that onClick is not part of that control's "workings", but it will be rendered ok, and therefore can be used.

    Now, also... as far as I know (and I dont know javascript as well as others), you might need the control and the javascript on the same page.  Maybe not if it renders ok though.

    Let me know if this is what you are looking for!
    LVL 5

    Author Comment

    I am using visual studio and i don't seem to have the onclick event available for <asp:RadioButtonList   or for <asp:ListItem. So i can't connect up the function to my control..
    LVL 1

    Accepted Solution

    I know that onClick is not in the list, but it works.  I did it in Visual Studio and that is why I mentioned that it might appear that you cant do it.  You may have a squiggly line, but run the program anyway and you will see that it will render just fine.  The squiggly line shouldnt be red, but green, indicating that it isnt an error, but another type of message.  You will use the onClick for the radiolist itself, not the listitems.

    Basically what is happening is that the onClick event is what will work for when the control is rendered HTML since that will be an event that is recognized at that point.

    Featured Post

    6 Surprising Benefits of Threat Intelligence

    All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

    Join & Write a Comment

    User art_snob ( encountered strange behavior of Android Web browser on his Mobile Web site. It took a while to find the true cause. It happens so, that the Android Web browser (at least up to OS ver. 2.…
    Problem Hi all,    While many today have fast Internet connection, there are many still who do not, or are connecting through devices with a slower connect, so light web pages and fast load times are still popular.    If your ASP.NET page …
    This video is in connection to the article "The case of a missing mobile phone (". It will help one to understand clearly the steps to track a lost android phone.
    Get a first impression of how PRTG looks and learn how it works.   This video is a short introduction to PRTG, as an initial overview or as a quick start for new PRTG users.

    733 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    19 Experts available now in Live!

    Get 1:1 Help Now