html5中文学习网

您的位置: 首页 > 网络编程 > ASP.NET » 正文

AJAX应用带标题更新_.NET教程_编程技术

[ ] 已经帮助:人解决问题
ajax

这里的一个应用是UpdateProgress的应用完善。为了给用户显示的效果更好而设计。你可以参看效果:

http://szhxy.gliet.edu.cn/qxgl/登录显示的更新过程。

代码如下:


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<style type="text/css">
#UpdatePanel1 ...{
  width: 300px;
  height: 100px;
  border:solid 1px gray;
}   
</style>
    <title>更新测试</title>
</head>
<body>

    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="True" EnableScriptGlobalization="True" >

        </asp:ScriptManager>
        <div visible="false">
            <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="0">
                <ProgressTemplate>
                                   
                <div id="Progress" style="border: 1px solid rgb(73, 138, 194); padding: 0px; z-index: 1000;  margin-top: 20%; margin-left: 30%; width: 229px; position: absolute; height: 94px; background-color: rgb(255, 255, 255); border-collapse: collapse; left: 206px; top: 129px;">
                   
            <table cellpadding="4" cellspacing="0" style="width: 100%; height: 100%;">
            <tr>
                <td style=" height:26px; text-align: left; background-image: url(tile_back.gif); text-align: left;">
                <span style="font-size: 9pt;color: #ffffff"> <strong>系统提示</strong></span></td>
            </tr>
            <tr>
                <td  valign="middle" style="height:100%;text-align: center; vertical-align: middle;">
                <br />
                <br />
                <img alt="Waiting..." src="http://www.pushad.com/Info/indicator_mozilla_blu.gif" style="vertical-align: middle;border-top-style: none; border-right-style: none; border-left-style: none; border-bottom-style: none" />
                <span style="font-size: 9pt">正在处理,请稍后……</span></td>
            </tr>
    </table>
                </div>
                </ProgressTemplate>
            </asp:UpdateProgress>
        </div>

              
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                  密码:<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
                <br />
                密码确认:<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:Button ID="Button1" runat="server" Text="Button" />
            </ContentTemplate>

        </asp:UpdatePanel>
         
    </form>   
</body>
</html>

cs代码:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
...{
    protected void Page_Load(object sender, EventArgs e)
    ...{

    }
    protected void Button1_Click(object sender, EventArgs e)
    ...{
        //System.Threading.Thread.Sleep(3000);
        int j = 0;
        for (int i = 0; i < 100000000; i++)
        ...{
            j = i+j;
       
        }
            if (TextBox1.Text.Equals(TextBox2.Text))
            ...{
                Response.Redirect("/login.aspx");
            }
            else
            ...{
                Response.Redirect("/error.aspx");
            }
      
    }

}

不过根据研究,http://szhxy.gliet.edu.cn/qxgl/Login.aspx?ReturnUrl=%2fqxgl%2fDefault.aspx使用的方法如下:
他是通过调用htm文件实现图像显示的。

将表单代码去掉替换如下:
<iframe scrolling="no" frameborder="0" marginwidth="0" marginheight="0" src="bar.htm" /></iframe>

可见还需要一个bar.htm。这样我们就建个:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>系统提示</title>
</head>

<body style="margin: 0px">
    <table cellpadding="4" cellspacing="0" style="width: 100%; height: 100%;">
            <tr>
            <td style=" height:26px; text-align: left; background-image: url(tile_back.gif); text-align: left;">
                <span style="font-size: 9pt;color: #ffffff"> <strong>系统提示</strong></span></td>

        </tr>
        <tr>
            <td  valign="middle" style="height:100%;text-align: center; vertical-align: middle;">
                <br />
                <br />
                <img alt="Waiting..." src="http://www.pushad.com/Info/indicator_mozilla_blu.gif" style="vertical-align: middle;border-top-style: none; border-right-style: none; border-left-style: none; border-bottom-style: none" />
                <span style="font-size: 9pt">正在处理,请稍后……</span></td>
        </tr>

    </table>

</body>
</html>

测试通过

 

qBTHTML5中文学习网 - HTML5先行者学习网
qBTHTML5中文学习网 - HTML5先行者学习网
(责任编辑:)
推荐书籍
推荐资讯
关于HTML5先行者 - 联系我们 - 广告服务 - 友情链接 - 网站地图 - 版权声明 - 人才招聘 - 帮助