52,787
社区成员
发帖
与我相关
我的任务
分享微软提供的ajax怎么在javascript里面直接调用后台的方法
只知道有一个ScriptManager.还有一个UpdatePanel.里要把控件放在里面就自动实现ajax效果..那么比较我就是想要在前台javascript脚本里面调用一个后台的方法获取数据,我要怎么办呢? 就像java的DWR框架一样.
个人感觉.net为我们封装了太多的东西,以致于我都不知道他内部是如何实现的.
个人感觉.net为我们封装了太多的东西,以致于我都不知道他内部是如何实现的.
...全文
请发表友善的回复…
发表回复
antony1029 2010-01-15
- 打赏
- 举报
开发过程中，我们总想在前台直接调用后台的method，其原因无非是想控制页面刷新，改善用户体验。可以达到这个目的的方法有很多：Ajax应该是用的最多的情况.这里要说的是利用Javascript和webservice的交互来达到目的。
1.当然要建立WebService(简便起见，WebService就建立在当前方案中)：
using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
/**//// <summary>
/// WebService 的摘要描述
/// </summary>
///
[System.Web.Script.Services.ScriptService] //注意要实现目的，这就必不可少
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class WebService : System.Web.Services.WebService ...{
public WebService () ...{
//如果使用設計的元件，請取消註解下行程式碼
//InitializeComponent();
}
[WebMethod]
public string sayhi(string name,string age)
...{
//code here
return "Hello,this is "+name+",i am"+age ;
}
} 2.新建页面ajaxWebService.aspx，建立前台代码，其中要用ScriptManager对service进行注册。先看代码：
<%...@ Page Language="C#" AutoEventWireup="true" CodeFile="ajaxWebService.aspx.cs" Inherits="ajaxWebService" %>
<%...@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>
<!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 check()
...{
var name=document.getElementById("txtname").value;
var age=document.getElementById("txtage").value;
//最后一个参数为回调函数名称
WebService.sayhi(name,age,updatepage);
}
//其中result即返回的结果
function updatepage(result)
...{
alert(result);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services >
<asp:ServiceReference Path ="~/WebService.asmx" />
</Services>
</asp:ScriptManager>
<input id="txtname" name="txtname" type="text" />
<input id="txtage" name="txtage" type="text" />
<input id="Button1" type="button" value="button" onclick ="check()" />
</div>
</form>
</body>
</html>
3.说明：
除了上述两点需要注意外，还有一点需要强调一下：
调用的方法很简单，[WebServiceName].[MethodName](...),其中的参数列中最后一项应该为回调函数名称。而回调函数的参数既是回传的结果。见上例。
1.当然要建立WebService(简便起见，WebService就建立在当前方案中)：
using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
/**//// <summary>
/// WebService 的摘要描述
/// </summary>
///
[System.Web.Script.Services.ScriptService] //注意要实现目的，这就必不可少
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class WebService : System.Web.Services.WebService ...{
public WebService () ...{
//如果使用設計的元件，請取消註解下行程式碼
//InitializeComponent();
}
[WebMethod]
public string sayhi(string name,string age)
...{
//code here
return "Hello,this is "+name+",i am"+age ;
}
} 2.新建页面ajaxWebService.aspx，建立前台代码，其中要用ScriptManager对service进行注册。先看代码：
<%...@ Page Language="C#" AutoEventWireup="true" CodeFile="ajaxWebService.aspx.cs" Inherits="ajaxWebService" %>
<%...@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>
<!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 check()
...{
var name=document.getElementById("txtname").value;
var age=document.getElementById("txtage").value;
//最后一个参数为回调函数名称
WebService.sayhi(name,age,updatepage);
}
//其中result即返回的结果
function updatepage(result)
...{
alert(result);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services >
<asp:ServiceReference Path ="~/WebService.asmx" />
</Services>
</asp:ScriptManager>
<input id="txtname" name="txtname" type="text" />
<input id="txtage" name="txtage" type="text" />
<input id="Button1" type="button" value="button" onclick ="check()" />
</div>
</form>
</body>
</html>
3.说明：
除了上述两点需要注意外，还有一点需要强调一下：
调用的方法很简单，[WebServiceName].[MethodName](...),其中的参数列中最后一项应该为回调函数名称。而回调函数的参数既是回传的结果。见上例。
