• Jquery getJSON() 序列化类以及集合(转)


    getJSON与aspx

    准备工作

    ·Customer类

     

    public class Customer
    {
    public int Unid { get; set; }
    public string CustomerName { get; set; }
    public string Memo { get; set; }
    public string Other { get; set; }
    }

     

    (一)ashx

     

    Customer customer = new Customer
    { Unid=1,CustomerName="宋江",Memo="天魁星",Other="黑三郎"};

    string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(customer);

    context.Response.Write(strJson);

     

    function GetCustomer_Ashx() {
    $.getJSON(
    "webdata/Json_1.ashx",
    function(data) {
    var tt = "";
    $.each(data, function(k, v) {
    tt += k + ":" + v + "<br/>";
    })

    $("#divmessage").html(tt);
    });
    }

    ·通过getJSON向ashx请求数据。返回的数据为JSON对象。

    (二)ashx文件,但返回的是实体集合

     

    Customer customer = new Customer
    { Unid=1,CustomerName="宋江",Memo="天魁星",Other="黑三郎"};

    Customer customer2 = new Customer
    { Unid = 2, CustomerName = "吴用", Memo = "天机星", Other = "智多星" };

    List<Customer> _list = new List<Customer>();
    _list.Add(customer);
    _list.Add(customer2);

    string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(_list);
    context.Response.Write(strJson);

     

     

     

    function GetCustomerList() {
    $.getJSON(
    "webdata/Json_1.ashx",
    function(data) {
    var tt = "";
    $.each(data, function(k, v) {
    $.each(v,function(kk, vv) {
    tt += kk + ":" + vv + "<br/>";
    });
    });
    $("#divmessage").html(tt);
    });
    }

    具体可以参看:http://www.cnblogs.com/jams742003/archive/2009/12/25/1632276.html

    (三)请求aspx文件

    ·cs文件

     

    protected void Page_Load(object sender, EventArgs e)
    {
    Customer customer = new Customer
    { Unid = 1, CustomerName = "宋江", Memo = "天魁星", Other = "黑三郎" };

    string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(customer);

    Response.Write(strJson);
    }

     

     

    ·Aspx文件

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Json_1.aspx.cs"
    Inherits="webdata_Json_1" %>

    前台文件只保留Page声明,其它全部删除。

     

    ·js文件

     

    function GetCustomer_Aspx() {
    $.getJSON(
    "webdata/Json_1.aspx",
    function(data) {
    var tt = "";
    $.each(data, function(k, v) {
    tt += k + ":" + v + "<br/>";
    })
    $("#divmessage").html(tt);
    });
    }

    这个部分与请求ashx文件时相同。

    请求实体集合时,与ashx时相同,这里不做重复。

    (四)请求文本文件

    文本文件提供json字符串,由$.getJSON得到json对象。

    ·文本文件

    {Unid:1,CustomerName:"宋江",Memo:"天魁星",Other:"黑三郎"}

    文本文件提供json串,对于json的组成格式,请参见其它文档。对于这一实体json,会被忽略空行与空格。

     

    function GetCustomer_txt() {
    $.getJSON(
    "webdata/Json_1.txt",
    function(data) {
    var tt = "";
    $.each(data, function(k, v) {
    tt += k + ":" + v + "<br/>";
    })
    $("#divmessage").html(tt);
    });
    }

    解析的方法与其它的相同。

     

    对于多行的如下:

    文本:

    [

    {Unid:1,CustomerName:"宋江",Memo:"天魁星",Other:"黑三郎"},

    {Unid:2,CustomerName:"吴用",Memo:"天机星",Other:"智多星"}

    ]

     

    解析:

     

    function GetCustomer_TxtList() {
    $.getJSON(
    "webdata/Json_1.txt",
    function(data) {
    var tt = "";
    $.each(data, function(k, v) {
    $.each(v, function(kk, vv) {
    tt += kk + ":" + vv + "<br/>";
    });
    });
    $("#divmessage").html(tt);
    });
    }

    与其它的相同。

    (五)带参数ajax请求

    以ashx为例子,按客户id来请求客户。

    ·Ashx文件

     

    if(context.Request["iUnid"]==null)
    return;

    context.Response.ContentType = "text/plain";

    Customer customer = new Customer
    { Unid = 1, CustomerName = "宋江", Memo = "天魁星", Other = "黑三郎" };

    Customer customer2 = new Customer
    { Unid = 2, CustomerName = "吴用", Memo = "天机星", Other = "智多星" };

    List<Customer> _list = new List<Customer>();
    _list.Add(customer);
    _list.Add(customer2);


    int iCustomerId =Convert.ToInt32(context.Request["iUnid"]);
    var cus = from q in _list
    where q.Unid == iCustomerId
    select q;

    string strJson = Newtonsoft.Json.JsonConvert.SerializeObject(cus);
    context.Response.Write(strJson);

    ·ajax请求

     

    function GetCustomer_AshxWithPara() {
    $.getJSON(
    "webdata/Json_2.ashx",
    { iUnid: 1 },
    function(data) {
    var tt = "";
    $.each(data, function(k, v) {
    $.each(v, function(kk, vv) {
    tt += kk + ":" + vv + "<br/>";
    });
    });

    $("#divmessage").html(tt);
    });
    }

    其中参数也是以k/v对格式发出。请求返回的可以看到:在服务端以Customer列表集合返回。

     

    在jquery库中,getJSON其实是调用的:Query.get(url, data, callback, "json")

    这点很重要。

  • 相关阅读:
    微信小程序全屏飘落效果(飘雪、掉落、canvas)
    放在cnblogs上的文件资源
    JavaScript笔记Array.filter(Boolean)
    webpack 4.0 配置文件 webpack.config.js文件的放置位置
    package.json中^,~的区别
    你不知道的 JSON.stringify() 的威力
    vue+axios通过formdata提交参数和上传文件
    webstorm激活教程----亲测可用
    git修改远程仓库地址
    微信小程序通讯录字母排序
  • 原文地址:https://www.cnblogs.com/zwl12549/p/1999223.html
Copyright © 2020-2023  润新知