Asp.net 使用Ajax 控件访问服务端的方法与，服务端访问客户端的方法

一.  客户端调用服务端的方法 之一 ，ajax controltoolkit

1.安装Asp.net Ajax extension 组件 ASPAJAXExtSetup.msi  下载地址http://www.microsoft.com/downloads/en/details.aspx?FamilyID=ca9d90fa-e8c9-42e3-aa19-08e2c027f5d6&displaylang=en

2.拷贝需要的dll，在C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025 目录下的，AJAXExtensionsToolbox.dll，System.Web.Extensions.Design.dll，System.Web.Extensions.dll,在默认的安装目录下。

3.修改网站的web.config文件，如下:

   1 <?xml version="1.0"?>

  2 <configuration>
  3   <configSections>
  4     <sectionGroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
  5       <sectionGroup name="scripting" type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
  6         <section name="scriptResourceHandler" type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
  7         <sectionGroup name="webServices" type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35">
  8           <section name="jsonSerialization" type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="Everywhere"/>
  9           <section name="profileService" type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
 10           <section name="authenticationService" type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/>
 11         </sectionGroup>
 12       </sectionGroup>
 13     </sectionGroup>
 14   </configSections>
 15   
 16     <appSettings />
 17     <connectionStrings />
 18     <system.web>
 19       <pages>
 20         <controls>
 21           <add tagPrefix="asp" namespace="System.Web.UI" assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 22         </controls>
 23       </pages>
 24         <compilation debug="true">
 25           <assemblies>
 26             <add assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 27           </assemblies>
 28         </compilation>
 29       <httpHandlers>
 30         <remove verb="*" path="*.asmx"/>
 31         <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 32         <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 33         <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>
 34       </httpHandlers>
 35       <httpModules>
 36         <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 37         <add name="NonstaticPageMethodModule" type="NonstaticPageMethod.PageMethodModule, NonstaticPageMethod"/>
 38       </httpModules>
 39         <!--
 40             通过 <authentication> 节可以配置
 41             安全身份验证模式，ASP.NET 
 42             使用该模式来识别来访用户身份。 
 43         -->
 44         <authentication mode="Windows" />
 45         <!--
 46             如果在执行请求的过程中出现未处理的错误，
 47             则通过 <customErrors> 节
 48             可以配置相应的处理步骤。具体而言，
 49             开发人员通过该节可配置要显示的 html 错误页，
 50             以代替错误堆栈跟踪。
 51 
 52         <customErrors mode="RemoteOnly" defaultRedirect="GenericErrorPage.htm">
 53             <error statusCode="403" redirect="NoAccess.htm" />
 54             <error statusCode="404" redirect="FileNotFound.htm" />
 55         </customErrors>
 56         -->
 57       <!--<globalization culture="en-US" uiCulture="en-US"/>-->
 58     </system.web>
 59   <system.web.extensions>
 60     <scripting>
 61       <webServices>
 62         <!-- Uncomment this line to customize maxJsonLength and add a custom converter -->
 63         <!--
 64       <jsonSerialization maxJsonLength="500">
 65         <converters>
 66           <add name="ConvertMe" type="Acme.SubAcme.ConvertMeTypeConverter"/>
 67         </converters>
 68       </jsonSerialization>
 69       -->
 70         <!-- Uncomment this line to enable the authentication service. Include requireSSL="true" if appropriate. -->
 71         <!--
 72         <authenticationService enabled="true" requireSSL = "true|false"/>
 73       -->
 74         <!-- Uncomment these lines to enable the profile service. To allow profile properties to be retrieved
 75            and modified in ASP.NET AJAX applications, you need to add each property name to the readAccessProperties and
 76            writeAccessProperties attributes. -->
 77         <!--
 78       <profileService enabled="true"
 79                       readAccessProperties="propertyname1,propertyname2"
 80                       writeAccessProperties="propertyname1,propertyname2" />
 81       -->
 82       </webServices>
 83       <!--
 84       <scriptResourceHandler enableCompression="true" enableCaching="true" />
 85       -->
 86     </scripting>
 87   </system.web.extensions>
 88   <system.webServer>
 89     <validation validateIntegratedModeConfiguration="false"/>
 90     <modules>
 91       <add name="ScriptModule" preCondition="integratedMode" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 92     </modules>
 93     <handlers>
 94       <remove name="WebServiceHandlerFactory-Integrated"/>
 95       <add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 96       <add name="ScriptHandlerFactoryAppServices" verb="*" path="*_AppService.axd" preCondition="integratedMode" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 97       <add name="ScriptResource" preCondition="integratedMode" verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
 98     </handlers>
 99   </system.webServer>
100 </configuration>

 4. aspx 页面添加如下内容：

 <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>。此处注意一点，如果是把改段代码放在模板页里，则必须这样写，        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">               

        </asp:ContentPlaceHolder>。既与content并列

5.aspx.cs 文件里添加

using System.Web.Services;

using System.Web.Script.Services;

[ScriptService]

    public partial class EditUserForm : System.Web.UI.Page

    {

   [ScriptMethod]

        [WebMethod]

        public string ChangeLabel(string message)

        {

            return "服务端" + message;

        }

}

6.客户端调用

添加动态库NonstaticPageMethod.dll 

    <script language="javascript" type="text/javascript">

        function onbntServcerClickHandler() {

            NonstaticPageMethods.ChangeLabel("hello", onSuccess);

        }

        function onSuccess(result) {

            alert(result);

        }

    </script>

web.config 添加 <add name="NonstaticPageMethodModule" type="NonstaticPageMethod.PageMethodModule, NonstaticPageMethod"/>

 

7，缺点，NonstaticPageMethods只能在ie里边使用

 二. 客户端调用服务端的方法 之一  AjaxPro.2.dll 的使用，优点是任何浏览器都可以使用

 1.网上下载AjaxPro.2.dll 

 2.网站添加该引用

 3.web.config 添加相应的配置

        </httpHandlers>

  <add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro.2"/>

</httpHandlers>

 ASP.NET本身就提供了多种调用javascript脚本的方法，本文总结了六种调用方法，大家根据自己的使用习惯可以选择相应的调用方式了！

4. 页面注册类型

       protected void Page_Load(object sender, EventArgs e)

        {

            //

            AjaxPro.Utility.RegisterTypeForAjax(typeof(WebApplicationTest.Admin.EditUserForm));

        }

以及方法定义:

        [AjaxPro.AjaxMethod]

        public string GetServerTime()

        {

            return DateTime.Now.ToString();

        }

5.客户端 即网页调用

var result = WebApplicationTest.Admin.EditUserForm.GetServerTime();

        alert(result.value);

 三. 服务端调用客户端方法 

1、直接在前台调用 javascript 函数

很简单,在 head 元素之间加入 script 元素,将 type 元素设置为 " text/javascript "

如:

<head runat="server">

<script type="text/javascript" >

function ShowName(str)

{

alert("您的名字为:("+str+")");

}

</script>

    <title>using javascript</title>

</head>

之后在body 元素间,通过事件来访问 如 要通过button1 的单击事件(onclientclick)来访问 javascript 函数

示例如下:

<asp:Button ID="Button1" runat="server" Text="Button"  onclientclick="ShowName('XXX')"  />

这时运行项目,单击 button时,会显示"您的名称为XXX"

这就是一个简单的javascript 函数.

2、在前台通过 js文件 调用

方法与 （1）一样 只不过需要指定 .js 文件

示例如下:

<head runat="server">

<script type="text/javascript" src="JScript.js">

</script>

    <title>using javascript</title>

</head>

之后在body 元素间,通过事件来访问 如 要通过button1 的单击事件(onclientclick)来访问 javascript 函数

示例如下:

//此时 .js文件中必须有 ShowName 方法

<asp:Button ID="Button1" runat="server" Text="Button"  onclientclick="ShowName('XXX')"  />

3、在后台调用 javascript 函数,函数在.js文件中

前台的head 元素

<head runat="server">

<script type="text/javascript" src="JScript.js">

</script>

    <title>using javascript</title>

</head>

后台的需要添加如下代码

Button1.Attributes.Add("onclick", "showname1(XXX)");

4、在后台调用 javascript 函数,函数写在 .js文件中,但并没有在前台定义

//获得.js文件

string myscript = "JScript.js";

//注册.js文件, 如果此时查看源码,会得到如下代码

//<script> src ="JScript.js" type="text/javascript"><script>

Page.ClientScript.RegisterClientScriptInclude("myKey", myscript);

//同上

Button1.Attributes.Add("onclick", "showname1(123)");

5. 用Response.Write方法写入脚本

比如在你单击按钮后，先操作数据库，完了后显示已经完成，可以在最后想调用的地方写上

Response.Write("<script type='text/javascript'>alert();</script>");

这个方法有个缺陷就是不能调用脚本文件中的自定义的函数，只能调用内部函数，具体调用自定义的函数只能在Response.Write写上函数定义，比如Response.Write("<script type='text/javascript'>function myfun(){...}</script>");

6.用ClientScript类动态添加脚本

    用法如下：在想调用某个javascript脚本函数的地方添加代码，注意要保证MyFun已经在脚本文件中定义过了。

    ClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<script>MyFun();</script>");

这个方法比Response.Write更方便一些，可以直接调用脚本文件中的自定义函数。

注意，以上所有方法中，后台代码都不能有转化当前页的代码，比如Redirect等，要把转页代码放在脚本里面