Click the row to automatically select the single button in the current row.

Click the row to automatically select the single button in the current row.
Requirement: Click the row to automatically select the single button in the current row.

Aspx page:

     <asp:Repeater ID="rptRecordList" runat="server">                                    <HeaderTemplate>                                        <table style="width: 100%;" id="tbList">                                    </HeaderTemplate>                                    <ItemTemplate>                                        <tr class="order-item">                                            <td style="width: 96px;" class="item">                                                <span style="margin-right: 4px;"><%# Container.ItemIndex +1 %></span>                                                <input type="radio" name="rbtn" id="rbtn1" value='<%#Eval("hx_t_watermeterid")%>' />                                            </td>                                            <td style="width: 200px;" class="item"><%#Eval("name") %></td>                                            <td style="width: 200px;" class="item"><%#Eval("accountnumber") %></td>                                            <td class="last"><%#Eval("hx_fmetercode") %></td>                                        </tr>                                    </ItemTemplate>                                    <FooterTemplate>                                        </table></FooterTemplate>                                </asp:Repeater>

Js Code:

$ (Document ). ready (function () {// $ ("# tbList tr: odd "). addClass ("alt"); even row style // $ ("# tbList tr: even" ).css ("background-color", "white "); // odd row style $ ("# tbList tr "). hover (function () {$ (this ). addClass ('overcss ');}, function () {$ (this ). removeClass ('overcss ');}). click (function (e) {if ($ (e. srcElement | e.tar get ). attr ("type ")! = "Radio") {$ (this ). find (": radio "). click (); // $ (this ). find (": radio "). attr ("checked", true); problem}); $ ("# tbList input [type = 'Radio ']"). click (function () {$ (this ). parent (). parent (). addClass ('clickcss '). siblings (). removeClass ('clickcss '). end ();});});

Css style:

. AltCss {background: # fff;/* This line adds the background color to all tr */}. overCss {background-color: # FEF2E8;/* # EEF2FB: the background color of the highlighted line with the mouse */}. clickCss {background-color: # A7CDF0;}/* 3366ff */

How can I use a simple js/css method to select a single row?

Choose jquery.
Add a click event to tr
<Tr onclick = "myclick (this)"> <td> single queue </td> <td> 123 </td> </tr>
Corresponding js
Function myclick (o ){
// Obtain the first Node object of the subnode

Var rd = $ (o). children (). first ();

Rd. checked = true; // select this radio button

}
Hope to adopt

How to achieve single-click selection, and click it again is not selected

This is not easy ..

Private CurrentRadioButtonChecked;

In the form Load
Private void Form1_Load (object sender, EventArgs e)
{
CurrentRadioButtonChecked = radioButton1.Checked; // to save the current status
}
Select radioButton1's Click Event
Private void radioButton1_Click (object sender, EventArgs e)
{
If (CurrentRadioButtonChecked)
{
RadioButton1.Checked = false;
CurrentRadioButtonChecked = false;
}
Else
{
RadioButton1.Checked = true;
CurrentRadioButtonChecked = true;
}
}