在最近开始将AJAX技术加入到日常的开发工作中。我在最近写了个AJAX的无刷新登陆且动态添加服务器控件的工作,我将此功能告诉大家希望对大家的工作有所帮助。如果大家有更好的方法且愿意在此留言让我也可以分享到你的成果。
首先在页面中的HTML标记中加入控件UpdatePanel和两个Textbox一个Button:
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers=false UpdateMode=Conditional>
<ContentTemplate>
用户名:<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
密码:<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:Button ID="btnOK" runat="server" OnClick="btnOK_Click" Text="登陆" Width="103px" />
<div id="error" style="width: 616px; height: 23px; font-weight: bold; color: red;" align="center" language="javascript" οnclick="return error_onclick()" >
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnOK" />
</Triggers>
</asp:UpdatePanel>
在完成后如大家看到的我在Trigger中将Button注册为异步调用控件,这样当我点击是就会触发异步的数据传送。
接下来在CS文件中的Button的Click事件中添加一下代码:
.......
switch (ps.BOOL)
{
case "Ok":
//清空UpdatePanel内的所有控件
this.UpdatePanel1.ContentTemplateContainer.Controls.Clear();
Label labInfo = new Label();
labInfo.ID = "newlabel";
labInfo.Width = 600;
labInfo.Height = 23;
labInfo.Font.Bold = true;
labInfo.ForeColor = Color.Red;
labInfo.Text = " 登陆成功 欢迎 " + ps.NAME + " 登陆 ! ";
this.UpdatePanel1.ContentTemplateContainer.Controls.Add(labInfo);
break;
case "Null":ScriptManager.RegisterStartupScript(this.UpdatePanel1, this.GetType(), "UpdatePanel1", "$get('error').innerHTML = '登陆失败 !';", true);
break;
default: ; break;
}
........
完成这段代码就基本上实现了登陆的无刷新和动态添加显示控件的功能。