Asp.net2运用JQuery构建客户端/服务端分离的链接模型

随着框架的越来越流行，对于后台业务逻辑框架和WEB表现层框架，市面上可以找到很多非常好的开源框架。不过我始终在想一个问题，对于Java来说，只能使用java下的框架；而对于微软来说，也只能使用其体系下开发的框架，那么有没有可能混合使用呢？

    何为混合使用？就是表现层全部使用静态页面后缀(.htm),而后台可以是java构建的业务层模型，也可以是微软Donet构建的业务层模型，这样不管后台使用什么模型，只要提供方提供了足够我访问的接口，就可以调用不同的架构的接口来实现表现层上的内容。

    JQuery 是最近很流行的一个Ajax框架，其具体的运用和功能不在这里进行讲解，但我们可以使用其内嵌的Ajax方法，去调用后台服务端的代码，已实现客户端和服务端的通信。因为客户端是静态页面，其通过WebService调用服务端的方法，这样很明显，客户端可以完全不管服务端是何种语言开发的，达到了混合使用的目的。

   这种混合使用可以定义为 WEB端和后台业务逻辑端的连接架构模型。

 

这里仅仅是讨论了JQuery在Ajax层面与服务端的交互通信的用法，不涉及JQuery的其他用法

 

以下以一个小小的例子来说明一下：

注：本人javascript和JQuery基础较差，因此例子也相对简单。

 

环境说明：

Asp.net 2.0

外接类库: System.Web.Extensions.dll

JQuery框架: 1.3

 

第一步：创建一个WebService服务，修改Web.config

工程引入System.Web.Extensions.dll

 

在 <system.web> 下面

<httpHandlers>
    <remove verb="*" path="*.asmx"></remove>
    <add verb="*" path="*.asmx"

        type="System.Web.Script.Services.ScriptHandlerFactory,  System.Web.Extensions, 
        Version=1.0.61025.0, Culture=neutral,PublicKeyToken=31bf3856ad364e35"/>
</httpHandlers>

 

第二步：对asmx文件编码

JSon.asmx 

  JSon.cs

 

using System.Web.Script.Serialization;
using System.Web.Script.Services;

 

[ScriptService]
public class Json : System.Web.Services.WebService
{

   [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public string TestPersonJson(string name) {

        List<Person> list = new List<Person>();

        Person person = new Person();
        person.Birthday = DateTime.Now;
        person.ID = "111" + ">>" +name;
        person.Sex = "1";
        person.Status = 1;

        Person person1 = new Person();
        person1.Birthday = DateTime.Now;
        person1.ID = "222" + ">>" + yy;
        person1.Sex = "2";
        person1.Status = 1;

        Person person2 = new Person();
        person2.Birthday = DateTime.Now;
        person2.ID = "333" + ">>" + name;
        person2.Sex = "1";
        person2.Status = 1;

        list.Add(person);
        list.Add(person1);
        list.Add(person2);

       return new JavaScriptSerializer().Serialize(list);

    }

}

 

以上就是cs代码，重点关注有颜色的部分。这些有颜色的代码其实就是JSon的应用，后台返回方法编译成JSon格式的编码发到客户端（htm）页面上，客户端代码解码来获取值。

 

第三步：创建一个htm客户端页面

<script type="text/javascript"  src="../js_Core/jquery-1.3.2.min.js"></script>   这个不可少

 

看一下怎样从服务端获取值呈现在页面,见以下javascript代码

function testJson() {             
        $.ajax({
            type: "POST",
            url: "http://127.0.0.1:4000/Json.asmx/TestPersonJson",
            data: "{name:'小王'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(msg){
                 var data = ("(" + msg + ")");    
                 var t = "<table border='1'>" +
                         "<tr>"+
                             "<td>ID</td>" +
                             "<td>Sex</td>" +
                             "<td>Birthday</td>" +
                     

转载于:https://www.cnblogs.com/AflutterFeather/archive/2010/01/07/1641315.html