user123456789
user123456789

Reputation: 2004

Radio button onclick not working

I have 3 radio buttons that will display certain jobs from a list depending on which button is clicked. I used to use a search button to run the search code. So the user would select a radio button then click search. But now I have removed the search button and I want the radio buttons to call the search function when clicked.

<table>
  <tr>
    <td>
      <label id="lblAll" runat="server">All</label>
      <input type="radio" name="rbl_filter" runat="server" id="rbAll" onclick="btnSearch_Click" />
    </td>
    <td>
      <label id="lblCollections" runat="server">Collections</label>              
      <input type="radio" name="rbl_filter" runat="server" id="rbCollections" checked="true"  onclick="btnSearch_Click"/>
    </td>
    <td>
      <label id="lblDeliveries" runat="server">Deliveries</label>
      <input type="radio" name="rbl_filter" runat="server" id="rbDeliveries" onclick="btnSearch_Click" />                                                
    </td>
  </tr>
</table> 

I added the same onclick code that the search button was using. But nothing happens when I click the radio buttons

Upvotes: 2

Views: 16553

Answers (5)

Abid Ali
Abid Ali

Reputation: 1497

<label onclick="red()"><input type="radio" name="colors" id="red">Red</label>
or
<label onclick="red()"><input type="radio" name="colors" id="red"></label> <label for="red">Red</label>

<script>
function red(){
 alert('i am red');
}
</script>

if you want to call onclick function on radio button then you can use like this, it will work for you

Note: we have to call on function on label instead of radio button

Upvotes: 0

Padmanaban
Padmanaban

Reputation: 119

If you want to call your buttonclick event onclick of radio button.

For Example:

Hide your button if necessary.

<asp:Button ID="btnSearch" runat="server" OnClick="btnSeach_Click" style="display:none" />

<input type="radio" name="rbl_filter" runat="server" id="rbAll" onclick="searchClick(); return false;" />

JavaScript

<script type="text/javascript">
 function searchClick()
 {
    document.getElementById('<%= btnSearch.ClientID %>').click();
 }
</script>

Hope it would helps you!

Upvotes: 0

badr aldeen
badr aldeen

Reputation: 470

you have to use () after your function name

this is what you want

       function btnSearch_Click() {
         alert("hello");
       }
<table>
  <tr>
    <td>
      <label id="lblAll" runat="server">All</label>
      <input type="radio" name="rbl_filter" runat="server" id="rbAll" onclick="btnSearch_Click();" />
    </td>
    <td>
      <label id="lblCollections" runat="server">Collections</label>
      <input type="radio" name="rbl_filter" runat="server" id="rbCollections" checked="true" onclick="btnSearch_Click();" />
    </td>
    <td>
      <label id="lblDeliveries" runat="server">Deliveries</label>
      <input type="radio" name="rbl_filter" runat="server" id="rbDeliveries" onclick="btnSearch_Click();" />
    </td>
  </tr>
</table>

and for jsfiddle

Upvotes: 4

DieVeenman
DieVeenman

Reputation: 457

Go to your code behind, then add this to your EventHandler:

btnSearch_Click(object sender, EventArgs e) handles btnSearch.Click 

No need to add a onClick parameter to your HTML tag

Upvotes: 0

Script47
Script47

Reputation: 14530

Try,

onclick="btnSearch_Click();"

You need to have the parenthesis.

Example

http://jsfiddle.net/y9vn5fow/1/

Upvotes: 0

Related Questions