C#运用ajax实现updatepanel控件更新及弹窗

weixin_47488954

于 2021-05-13 17:53:26 发布

阅读量491

点赞数

分类专栏：网页文章标签： c# web

本文链接：https://blog.csdn.net/weixin_47488954/article/details/116245234

版权

网页专栏收录该内容

6 篇文章 0 订阅

订阅专栏

C#运用ajax实现updatepanel控件更新

一个页面要有不同的主题，如“我的主页”、“我的帖子”、“我的收藏”等等。
在点击相应功能时，如何实现页面的局部刷新呢？
有两种方法：
1、通过js调用.ashx页面，在.ashx中访问数据库、生成页面布局，将生成的局部页面返还给.aspx页面。
2、运用updatepanel控件。

updatepanel

在各类网站上用的较多的教程是updatepanel控件的运用，先来一波模板代码：

//这个一定要有，且若页面中有多个updatepanel控件，要将EnablePartialRendering属性设置为true
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="NickNameUpdate" runat="server">
	//contenttemplate中放置内容或其它控件
	<ContentTemplate>
		<a href="../login_logister/usr_login.aspx">用户登陆</a>&nbsp; <a href="../login_logister/usr_logister.aspx">这里注册</a>
	</ContentTemplate>
	//触发器，一定要有
    <Triggers>
		<asp:AsyncPostBackTrigger ControlID="触发器ID" EventName="Navigate" />
	</Triggers>
</asp:UpdatePanel>

triggers有的两种触发器asyncpostbacktrigger和postbacktrigger。
asyncpostbacktrigger（异步回调触发器）：局部刷新，只刷新updatepanel内部的内容
postbacktrigger（普通回调触发器）：全部刷新

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<ContentTemplate>

　　<% =DateTime.Now.ToString()%>

</ContentTemplate>

<Triggers>

　　<asp:PostBackTrigger ControlID="btn" />

　　<asp:AsyncPostBackTrigger ControlID="btn2" EventName="click" />

</Triggers>

</asp:UpdatePanel>

 

<asp:Button runat="server" Text="刷新1" id="btn"/>

<asp:Button runat="server" Text="刷新2" id="btn2" />

<% =DateTime.Now.ToString()%>

在updatepanel中的控件因为刷新，所以可能使用js的弹窗会有障碍，那么这个语句就可以成功解决啦！

ScriptManager.RegisterStartupScript(this.UpdatePanel1,this.GetType(), "提示", "alert('购物车为空,请先购物!')", true);

ashx局部刷新

在h5页面代码中

<head >
<script type="text/javascript">
   /**
         * *运行ashx，type是传递的参数
         * @param type
         */
        function themeSearch(type) {
        	var type1=type;
            go("ThemeManage.ashx?type=" + type);
        }
        
        /**
         * *跳转功能执行,destination指的是跳转地址，运行完毕在.ashx中返回h5语句
         * @param destination
         */
        function go(destination) {
            http.open("get", destination);
            http.send();
            http.onreadystatechange = callback;
        }
        function callback(){
            if (http.readyState == 4 && http.status == 200) {
                document.getElementById("RightColumn").innerHTML = http.responseText;
            }
        }
        </script >
< /head>

在body中，随便一个链接控件，button或者hyperlink或者a都可以，传递的参数固定可以直接输入，如果是变量那么那么就用document.getElementById(“控件id”)获取控件，加上.value获取控件值。在script中声明任何变量都是用var

<body>
	<asp:HyperLink ID="ThemeManage" runat="server" onclick="themeSearch('主题管理')" Text="主题管理" />
</body>

然后在ashx中随意编辑什么就可以在页面中得到了

weixin_47488954

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录