页面上用户控件之间的通信 - C#/ ASP.NET

时间:2022-06-02 16:46:19

If there are 2 user controls on a page and both of them have checbox controls. Checking/Unchecking a checkbox in one user control should check/uncheck the one in the other user control.

如果页面上有2个用户控件,并且它们都有checbox控件。选中/取消选中一个用户控件中的复选框应检查/取消选中另一个用户控件中的复选框。

I see there is a need for user control communication.

我看到需要用户控制通信。

Any way I can do this on the client side? (I don't want to use server side code)

我能在客户端做到这一点吗? (我不想使用服务器端代码)

Thanks

2 个解决方案

#1


yes, the easiest way to do this is using jquery css selectors and manipulating the checkbox values. here is a simple code snippet to do that :

是的,最简单的方法是使用jquery css选择器并操纵复选框值。这是一个简单的代码片段:

$("#checkbox1").attr("checked", $("#checkbox2").attr("checked"))

the value of checkbox1 is set depending upon the "checked" value of checkbox2

checkbox1的值是根据checkbox2的“checked”值设置的

#2


Off course, it goes without saying, there are easier ways of doing this with jQuery, but here's an example of how to do it without it.

当然,不言而喻,有更简单的方法可以用jQuery做到这一点,但这里有一个如何在没有它的情况下做到这一点的例子。

<asp:CheckBox runat="server" ID="CheckBox1" onclick="checkBoxChanged1(this)" />
<asp:CheckBox runat="server" ID="CheckBox2" onclick="checkBoxChanged2(this)"/>

<script type="text/javascript">
var checkBox1 = document.getElementById("<%=CheckBox1.ClientID %>");
var checkBox2 = document.getElementById("<%=CheckBox2.ClientID %>");
function checkBoxChanged1(e)
{
    checkBox2.checked = e.checked;      
}
function checkBoxChanged2(e)
{
    checkBox1.checked = e.checked;      
}
</script>

Here's the same example using jQuery:

这是使用jQuery的相同示例:

<script type="text/javascript">
  $(function(){
       $("#<%=CheckBox1.ClientID %>").click(function(){
           $("#<%=CheckBox2.ClientID %>").checked = this.checked;
        });
       $("#<%=CheckBox2.ClientID %>").click(function(){
           $("#<%=CheckBox1.ClientID %>").checked = this.checked;
        });             
   });
</script>

#1


yes, the easiest way to do this is using jquery css selectors and manipulating the checkbox values. here is a simple code snippet to do that :

是的,最简单的方法是使用jquery css选择器并操纵复选框值。这是一个简单的代码片段:

$("#checkbox1").attr("checked", $("#checkbox2").attr("checked"))

the value of checkbox1 is set depending upon the "checked" value of checkbox2

checkbox1的值是根据checkbox2的“checked”值设置的

#2


Off course, it goes without saying, there are easier ways of doing this with jQuery, but here's an example of how to do it without it.

当然,不言而喻,有更简单的方法可以用jQuery做到这一点,但这里有一个如何在没有它的情况下做到这一点的例子。

<asp:CheckBox runat="server" ID="CheckBox1" onclick="checkBoxChanged1(this)" />
<asp:CheckBox runat="server" ID="CheckBox2" onclick="checkBoxChanged2(this)"/>

<script type="text/javascript">
var checkBox1 = document.getElementById("<%=CheckBox1.ClientID %>");
var checkBox2 = document.getElementById("<%=CheckBox2.ClientID %>");
function checkBoxChanged1(e)
{
    checkBox2.checked = e.checked;      
}
function checkBoxChanged2(e)
{
    checkBox1.checked = e.checked;      
}
</script>

Here's the same example using jQuery:

这是使用jQuery的相同示例:

<script type="text/javascript">
  $(function(){
       $("#<%=CheckBox1.ClientID %>").click(function(){
           $("#<%=CheckBox2.ClientID %>").checked = this.checked;
        });
       $("#<%=CheckBox2.ClientID %>").click(function(){
           $("#<%=CheckBox1.ClientID %>").checked = this.checked;
        });             
   });
</script>