如何同步兩個控件？

Question

我的頁面有兩個完全單選按鈕列表，頂部和底部。如果我選擇頂部列表中的單選按鈕，我希望底部列表進行相同的更改。有什麼辦法可以實現這種同步嗎？ 我的單選按鈕列表位於內容頁面中。

<asp:RadioButtonList ID="rblVerification1" runat="server" RepeatDirection="Horizontal"> 
       <asp:ListItem Value="V">Verified</asp:ListItem> 
       <asp:ListItem Selected="True" Value="NV">Not Verified</asp:ListItem> 
</asp:RadioButtonList> 

更新： 我寫了下面的JavaScript功能，但它不能正常工作。第一個警報返回34，一個數字，我期待2.第二個警報返回未定義。有人可以告訴我做了什麼是錯的嗎？

function rblVerificationClicked(source, destination) { 
     alert(source.length); 
     var selectedValue; 
     for (var x = 0; x < source.length; x++) { 
      if (source[x].checked) { 
       selectedValue = source[x].value; 
       break; 
      } 
     } 
     alert(selectedValue); 
     for (var x = 0; x < destination.length; x++) { 
      destination[x].checked = false; 
     } 

     for (var x = 0; x < destination.length; x++) { 
      if (destination[x].value == selectedValue) { 
       destination[x].checked = true; 
       break; 
      } 
     } 
    } 

在Page_Load中，我加入

rblVerification.Attributes.Add("OnClick", string.Format("rblVerificationClicked('{0}', '{1}');", rblVerification.ClientID, rblVerification1.ClientID)); 
rblVerification1.Attributes.Add("OnClick", string.Format("rblVerificationClicked('{0}', '{1}');", rblVerification1.ClientID, rblVerification.ClientID)); 

解決： 我發現是什麼原因造成的問題。 asp：RadioButtonList呈現爲輸入type =「radio」的HTML元素。 因此，要獲得asp：RadioButtonList客戶端ID，請調用getElementsByTagName（「input」），它將返回一個單選按鈕數組。

Answer 1

最簡單的方法是通過JavaScript來做到這一點。我創建了下面的一些示例代碼：

的HTML：

<div id="list1"> 
    <input id="item1" type="radio" name="list1"/>Item 1 
    <input id="item2" type="radio" name="list1"/>Item 2 
    <input id="item3" type="radio" name="list1"/>Item 3 
<div> 
<br/> 
<div id="list2"> 
    <input id="item1" type="radio" name="list2"/>Item 1 
    <input id="item2" type="radio" name="list2"/>Item 2 
    <input id="item3" type="radio" name="list2"/>Item 3 
<div>​ 

中的JavaScript：

$("input[name=list1]:radio").bind("change", function(e) { 

    var chk = $("div#list2") 
     .children("input[id=" + $(this).attr("id") + "]"); 

    chk.attr("checked", true); 

}); 

我還創建了一個JsFiddle它，所以你可以看到它在行動。