服务器之家

服务器之家 > 正文

DropDownList设置客户端事件思路

时间:2019-12-24 12:57     来源/作者:lijiao

假设:数据源控件GrdiView,无刷新UpdatePannel,友情提示UpdateProgress,分页下拉框DropDownList

一般情况下:Gridview的分页有linkbutton或者button,这样要是想让UpdateProgress提示,很简单,先让GridView隐藏,然后给它加个OnClientClick就搞定!
在DropDownList的onchange事件里:

?
1
2
3
4
5
function selectChange() {
      if ($("select option").is(":selected")) {
        $("#btn11").click();
      }
    }

 跳转到:

?
1
2
<asp:DropDownList ID="ddlNeedPage" runat="server" AutoPostBack="true" onchange="return selectChange();">
</asp:DropDownList>

 

?
1
2
3
4
5
6
function clearData() {
      //$("#<%=_gvGuest.ClientID %>").empty();
      $("#_gvGuest").empty();
      //$("#<%=lblMessage.ClientID %>").hide();
      $("#lblMessage").hide();
    }
?
1
2
<asp:LinkButton ID="lnkFirstPage" runat="server" <span style="color:#ff0000;">OnClientClick="return clearData();"</span>
CommandName="Page" CommandArgument="First" Enabled="<%# ((GridView)Container.Parent.Parent).PageIndex != 0 %>">第一页</asp:LinkButton>

但是DropDownList没有OnClientClick事件,怎么办?

因为上面说了Button有Onclientclick我们可以想到借助Button来转换一下!!!!

解决办法:在页面上放一个隐藏的button:

?
1
<asp:Button ID="btn11" runat="server" CssClass="btnPage"Style="display: none;" OnClick="btn11_Click" OnClientClick="return clearData2();"/>

然后再OnClientClick事件里把下拉框的值赋给一个隐藏域

?
1
2
3
4
5
6
function clearData2() {
      var hidDDL = $("#_gvGuest_ddlNeedPage").val();
      $("#hidNeedPage").attr("value", hidDDL);
      $("#_gvGuest").empty();
      $("#lblMessage").hide();
    }

然后在click事件里将_gvGuest的PageIndex设置成隐藏域的value!

?
1
2
3
4
5
6
7
8
9
protected void btn11_Click(object sender, EventArgs e)
    {
 
      if (!string.IsNullOrEmpty(hidNeedPage.Value))
      {
        _gvGuest.PageIndex = Convert.ToInt32(hidNeedPage.Value);
        BindData();
      }
    }

 基本思路就实现了,相信通过上面一步步的实现大家对DropDownList设置客户端事件也有了大概了解,希望这篇文章真真正正的能够帮助到大家。

相关文章

热门资讯

玄元剑仙肉身有什么用 玄元剑仙肉身境界等级划分
玄元剑仙肉身有什么用 玄元剑仙肉身境界等级划分 2019-06-21
男生常说24816是什么意思?女生说13579是什么意思?
男生常说24816是什么意思?女生说13579是什么意思? 2019-09-17
配置IIS网站web服务器的安全策略配置解决方案
配置IIS网站web服务器的安全策略配置解决方案 2019-05-23
华为nova5pro和p30pro哪个好 华为nova5pro和华为p30pro对比详情
华为nova5pro和p30pro哪个好 华为nova5pro和华为p30pro对比详情 2019-06-22
Nginx服务器究竟是怎么执行PHP项目
Nginx服务器究竟是怎么执行PHP项目 2019-05-24
返回顶部