PageMethod 一种更简单、更快速的 Asp.Net AJAX 方法
通过释放 AJAX 的力量，我们可以轻松地提高 Web 应用程序的用户体验和性能。我喜欢 AJAX 中最好的东西之一是 PageMethod。
PageMethod 是一种我们可以在 java 脚本中公开服务器端页面方法的方法。这带来了很多机会，我们可以在不使用缓慢而烦人的回传的情况下执行大量操作。
在这篇文章中，我将展示 ScriptManager 和 PageMethod 的基本用法。在这个例子中，我正在创建一个用户注册表单，用户可以在其中使用他的电子邮件地址和密码进行注册。这是我要开发的页面的标记：
<body>
<form id="form1" runat="server">
<div>
<fieldset style="width: 200px;">
<asp:Label ID="lblEmailAddress" runat="server" Text="Email Address"></asp:Label>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<asp:Label ID="lblPassword" runat="server" Text="Password"></asp:Label>
<asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
</fieldset>
<div>
</div>
<asp:Button ID="btnCreateAccount" runat="server" Text="Signup" />
</div>
</form>
</body>
</html>
要设置页面方法，首先你必须在你的页面上拖一个脚本管理器。
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
</asp:ScriptManager>
另外请注意我已更改EnablePageMethods="true"。
这将告诉 ScriptManager 我将从客户端调用 PageMethods。
现在下一步是创建一个服务器端函数。
这是我创建的函数，该函数验证用户的输入：
[WebMethod]
public static string RegisterUser(string email, string password)
{
string result = "Congratulations!!! your account has been created.";
if (email.Length == 0)//Zero length check
{
result = "Email Address cannot be blank";
}
else if (!email.Contains(".") || !email.Contains("@")) //some other basic checks
{
result = "Not a valid email address";
}
else if (!email.Contains(".") || !email.Contains("@")) //some other basic checks
{
result = "Not a valid email address";
}
else if (password.Length == 0)
{
result = "Password cannot be blank";
}
else if (password.Length < 5)
{
result = "Password cannot be less than 5 chars";
}
return result;
}
要告诉脚本管理器这个方法可以通过 javascript 访问，我们需要确保两件事：
首先：这个方法应该是“public static”。
第二：方法上面应该有一个[WebMethod]标签，如上代码所写。
现在我已经创建了创建帐户的服务器端函数。现在我们必须从客户端调用它。以下是我们如何从客户端调用该函数：
<script type="text/javascript">
function Signup() {
var email = document.getElementById('<%=txtEmail.ClientID %>').value;
var password = document.getElementById('<%=txtPassword.ClientID %>').value;
PageMethods.RegisterUser(email, password, onSucess, onError);
function onSucess(result) {
alert(result);
}
function onError(result) {
alert('Cannot process your request at the moment, please try later.');
}
}
</script>
要调用我的服务器端方法注册用户，ScriptManager 会生成一个代理功能，该功能在 PageMethods 中可用。
我的服务器端函数有两个参数，即电子邮件和密码，在这些参数之后，我们必须再提供两个函数名称，如果方法成功执行（第一个参数即 onSucess）或方法失败（第二个参数即结果）将运行它们)。
现在一切似乎都准备好了，现在我在我的注册按钮上添加了OnClientClick="Signup();return false;"。所以这里是我的aspx页面的完整代码：
<!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 runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
</asp:ScriptManager>
<fieldset style="width: 200px;">
<asp:Label ID="lblEmailAddress" runat="server" Text="Email Address"></asp:Label>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
<asp:Label ID="lblPassword" runat="server" Text="Password"></asp:Label>
<asp:TextBox ID="txtPassword" runat="server"></asp:TextBox>
</fieldset>
<div>
</div>
<asp:Button ID="btnCreateAccount" runat="server" Text="Signup" OnClientClick="Signup();return false;" />
</div>
</form>
</body>
</html>
<script type="text/javascript">
function Signup() {
var email = document.getElementById('<%=txtEmail.ClientID %>').value;
var password = document.getElementById('<%=txtPassword.ClientID %>').value;
PageMethods.RegisterUser(email, password, onSucess, onError);
function onSucess(result) {
alert(result);
}
function onError(result) {
alert('Cannot process your request at the moment, please try later.');
}
}
</script>