asp.net 中RadioButtonList的选项改变事件处理(采用jquery操作)

原创 2015年07月09日 18:56:35

实现的效果如下图所示:

                                

可以设置RadioButtonList的autopostback属性为true,然后处理其OnSelectedIndexChanged事件,但是这样会造成回发事件,造成页面刷新,用户体验不好,于是这里采用jquery来操作。


aspx中的页面如下代码所示:

  <div style="height: 35px;">
      <table width="170px">
              <tr>
                    <td style="width:30px;">
                             <asp:Label ID="lblDate" runat="server" Text="对比:">
                                        </asp:Label></td>
                     <td style="width:80px;">
                                        <asp:DropDownList ID="ddlYear" runat="server" ></asp:DropDownList>年</td>
                      <td style="width:60px;">
                            <span id="divMonth" style="display:none;">
                                  <asp:DropDownList ID="ddlMonth" runat="server"></asp:DropDownList>月</span>
                     </td>
               </tr>
       </table>
  </div>
  <div style="height: 35px;">
        <asp:RadioButtonList runat="server" ID="rblType">
                   <asp:ListItem Value="年" Text="年同环比" Selected="True"></asp:ListItem>
                    <asp:ListItem Value="月" Text="月同环比"></asp:ListItem>
         </asp:RadioButtonList>
   </div>


这里使用jquery来处理RadioButtonList的change事件,代码如下:

 $(function () {
      $("#<%=rblType.ClientID %>").change(function () {
            var SelectVal = $(":input:radio[@name='#<%= rblType.ClientID%> > input'][checked]").val()
            if (SelectVal != "年") {
                  $("#divMonth").css("display", "block");
            }
            else {
                 $("#divMonth").css("display", "none");
            }
     });
 });

jquery中获取RadioButtonList中选中的值方法:

 //获取页面加载时RadioButtonList选中的值
 var SelectVal = $(":input:radio[@name='#<%= rblType.ClientID%> > input'][checked]").val();

获取ASP.NET DropDownList控件下拉选项改变时,显示或隐藏某个控件的jquery写法类似如下:

 $(function () {
      $("#<%=Comb_EnergyType.ClientID %>").change(function () {
          var SelectVal = $("#<%= Comb_EnergyType.ClientID%> option:selected").val();
            if (SelectVal == "01000") {
                $("#divSubEnergy").css("display", "block");
            }
            else {
                $("#divSubEnergy").css("display", "none");
            }
     });
 });



版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

jquery选择asp:RadioButtonList的选择项

有时需要根据客户端的选择结果来确定某些窗体部份显示或关闭.使用jquery可以来打开或关闭. html                             jquery方法一...

jquery 设置 asp:RadioButtonList

$.ajax({ type: "post", url: "VFB_CQ_ShaiCha_Edit.aspx/getBingDate", ...

jquery radiobutton select change

$(document).ready(function () {                 $(".radioItem").change(function () {               ...

RadioButtonList绑定后台数据,触发点击事件

首先前台页面放置一个RadioButtonList 控件                         RepeatLayout="Flow" AutoPostBack="true" OnSe...

Yii radioButtonList 设置默认选中项

网上看了很多,都没有讲到设置默认选中项,或者我比较笨,没找到,最后我只能自己追Yii的代码。 先看语法 public string radioButtonList(     CModel $mo...

ASP.NET基础与入门:WebForm,事件驱动编程,Page类

注:因为这个暑假做了一个ASP.NET的项目(WebForms模式),暑假期间太忙没有来得及整理,现在统一梳理下知识(有些我认为可以跟HTML共通的就没记)推荐几个学习ASP.NET的网站:W3Sch...
  • Jurbo
  • Jurbo
  • 2016年08月29日 15:10
  • 3928

asp.net获取radiobuttonlist选中值

今天组里的一个同事问我问什么他的radiobuttonlist获取不到选中的值,我说状态已经禁用了,所以获取不到。 但是问题来了,viewstate禁用了,为什么手动添加的可以获取到,从服务器提取出...

asp.net 用户控件中的委托事件SelectedIndexChanged

YearPicker.ascx //前台代码(必须添加AutoPostBack="true",否则无效)AutoPostBack="true" onselectedindexchanged="...

获取和设置asp:RadioButtonList的值

今天项目需要获取和设置asp:RadioButtonList的值,以前做过。掉过这个坑。后来做好了。自然也就把这个坑给忘了。现在记录一下。避免下次又掉进这个坑中。 微软的aspx网页编程中。用JQue...

Jquery调用后台的RadioButtonList_SelectedIndexChanged事件

前台代码: Jquery调用后台的RadioButtonList_SelectedIndexChanged事件 $(docu...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:asp.net 中RadioButtonList的选项改变事件处理(采用jquery操作)
举报原因:
原因补充:

(最多只允许输入30个字)