JavaScript调用web服务学习实例——用户注册
可以注册：
不可注册： ：
前台代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %>
<!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>
<script type="text/javascript">
function pageLoad() {
}
</script>
<style type="text/css">
.style1
{
width: 100%;
}
.style2
{
width: 131px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" >
<Scripts>
<asp:ScriptReference Path="ClientBehavior.js" />
</Scripts>
<Services>
<asp:ServiceReference Path="WebService.asmx" />
</Services>
</asp:ScriptManager>
<table class="style1">
<tr>
<td class="style2">
用户名：</td>
<td>
<input id="Text1" type="text" onblur ="check(document.getElementById('Text1').value, 'checkName' );" /><span id="Results"><img alt="" id="img" src="" /></span></td>
<td>
</td>
</tr>
<tr>
<td class="style2">
密码：</td>
<td colspan="2">
<input id="Text2" type="text" /></td>
</tr>
<tr>
<td class="style2">
</td>
<td colspan="2">
<input id="Button1" type="button" value="注册" onclick="zhuce(document.getElementById('Text1').value,document.getElementById('Text2').value,'zhuce');"/></td>
</tr>
<tr>
<td class="style2">
</td>
<td colspan="2">
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Javascript脚本：
/// <reference name="MicrosoftAjax.js"/>
function check(a,userContentext)
{
WebService.check(a,onsucceed,onfailed,userContentext,null);
}
function zhuce(name,pwd,userContentext)
{
if((name=="") || (pwd==""))
{
alert("用户名和密码不能为空");
return;
}
WebService.zhuce(name,pwd,onsucceed,onfailed,userContentext,null);
}
function onsucceed(result,userContentext)
{
if(userContentext=="checkName")
{
if(result=="no")
{
$get("img").src="images/false.gif";
$get("Button1").disabled=true;
}
else
{
$get("img").src="images/true.gif";
$get("Button1").disabled=false;
}
}
if(userContentext =="zhuce")
{
if(result=="yes")
{
alert("注册成功哦！");
}
else
{
alert("注册失败哦！");
}
}
}
// 这是失败的回调函数，它会接收错误对象。
function onfailed(error)
{
// 显示错误。
var stackTrace=error.get_stackTrace();
var message=error.get_message();
var statusCode=error.get_statusCode();
var exceptionType=error.get_exceptionType();
var timedout=error.get_timedOut();
var ReltElem=$get("Results");
ReltElem.innerHTML=
"堆栈追踪：" + stackTrace + "<br/>" +
"服务错误：" + message + "<br/>" +
"状态码：" + statusCode + "<br/>" +
"异常类型：" + exceptionType + "<br/>" +
"超时：" + timedout;
}
if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
WebServer代码：
using System;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Web.Script.Services;
using System.Data;
using System.Data.SqlClient;
using System.Web.Configuration;
/// <summary>
///WebService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{
public WebService()
{
//如果使用设计的组件，请取消注释以下行
//InitializeComponent();
}
[WebMethod]
public string check(string a)
{
string result;
SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString);
SqlCommand comm = new SqlCommand("proc_user", conn);
comm.CommandType = CommandType.StoredProcedure;
SqlParameter name = new SqlParameter("@Name", SqlDbType.NVarChar, 50);
name.Value = a;
comm.Parameters.Add(name);
conn.Open();
try
{
int i = (int)comm.ExecuteScalar();
if (i > 0)
{
result = "no";
}
else
{
result = "yes";
}
return result;
}
finally
{
conn.Close();
}
}
[WebMethod]
public string zhuce(string name, string pwd)
{
string result;
SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString);
SqlCommand comm = new SqlCommand("insert into [User] (Name,PWD) values (@Name,@PWD)", conn);
comm.Parameters.Add("@Name", SqlDbType.NVarChar, 50).Value = name;
comm.Parameters.Add("@PWD", SqlDbType.NVarChar, 50).Value = pwd;
conn.Open();
try
{
int i = (int)comm.ExecuteNonQuery();
if (i > 0)
{
result = "yes";
}
else
{
result = "no";
}
}
finally
{
conn.Close();
}
return result;
}
}
不可注册： ：
前台代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %><!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> <script type="text/javascript"> function pageLoad() {
function pageLoad() 
} </script> <style type="text/css"> .style1 { width: 100%; } .style2 { width: 131px; } </style></head><body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server" > <Scripts> <asp:ScriptReference Path="ClientBehavior.js" /> </Scripts> <Services> <asp:ServiceReference Path="WebService.asmx" /> </Services> </asp:ScriptManager> <table class="style1"> <tr> <td class="style2"> 用户名：</td> <td> <input id="Text1" type="text" onblur ="check(document.getElementById('Text1').value, 'checkName' );" /><span id="Results"><img alt="" id="img" src="" /></span></td> <td> </td> </tr> <tr> <td class="style2"> 密码：</td> <td colspan="2"> <input id="Text2" type="text" /></td> </tr> <tr> <td class="style2"> </td> <td colspan="2"> <input id="Button1" type="button" value="注册" onclick="zhuce(document.getElementById('Text1').value,document.getElementById('Text2').value,'zhuce');"/></td> </tr> <tr> <td class="style2"> </td> <td colspan="2"> </td> </tr> </table> </div> </form></body></html>Javascript脚本：
/// <reference name="MicrosoftAjax.js"/>function check(a,userContentext){ WebService.check(a,onsucceed,onfailed,userContentext,null);}function zhuce(name,pwd,userContentext){ if((name=="") || (pwd=="")) {
alert("用户名和密码不能为空"); return; } WebService.zhuce(name,pwd,onsucceed,onfailed,userContentext,null);}function onsucceed(result,userContentext){ if(userContentext=="checkName") { if(result=="no") { $get("img").src="images/false.gif"; $get("Button1").disabled=true; } else { $get("img").src="images/true.gif"; $get("Button1").disabled=false; } } if(userContentext =="zhuce") { if(result=="yes") { alert("注册成功哦！"); } else { alert("注册失败哦！"); } } }// 这是失败的回调函数，它会接收错误对象。function onfailed(error){ // 显示错误。 var stackTrace=error.get_stackTrace(); var message=error.get_message(); var statusCode=error.get_statusCode(); var exceptionType=error.get_exceptionType(); var timedout=error.get_timedOut(); var ReltElem=$get("Results"); ReltElem.innerHTML= "堆栈追踪：" + stackTrace + "<br/>" + "服务错误：" + message + "<br/>" + "状态码：" + statusCode + "<br/>" + "异常类型：" + exceptionType + "<br/>" + "超时：" + timedout;}if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();WebServer代码：
using System;using System.Collections;using System.Linq;using System.Web;using System.Web.Services;using System.Web.Services.Protocols;using System.Xml.Linq;using System.Web.Script.Services;using System.Data;using System.Data.SqlClient;using System.Web.Configuration;/// <summary>///WebService 的摘要说明/// </summary>[WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。 [System.Web.Script.Services.ScriptService]public class WebService : System.Web.Services.WebService{ public WebService() { //如果使用设计的组件，请取消注释以下行 //InitializeComponent(); } [WebMethod] public string check(string a) { string result; SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString); SqlCommand comm = new SqlCommand("proc_user", conn); comm.CommandType = CommandType.StoredProcedure; SqlParameter name = new SqlParameter("@Name", SqlDbType.NVarChar, 50); name.Value = a; comm.Parameters.Add(name); conn.Open(); try { int i = (int)comm.ExecuteScalar(); if (i > 0) { result = "no"; } else { result = "yes"; } return result; } finally { conn.Close(); } } [WebMethod] public string zhuce(string name, string pwd) { string result; SqlConnection conn = new SqlConnection(WebConfigurationManager.ConnectionStrings["Personal"].ConnectionString); SqlCommand comm = new SqlCommand("insert into [User] (Name,PWD) values (@Name,@PWD)", conn); comm.Parameters.Add("@Name", SqlDbType.NVarChar, 50).Value = name; comm.Parameters.Add("@PWD", SqlDbType.NVarChar, 50).Value = pwd; conn.Open(); try { int i = (int)comm.ExecuteNonQuery(); if (i > 0) { result = "yes"; } else { result = "no"; } } finally { conn.Close(); } return result; }}
