【转】Jquery 使用Ajax获取后台返回的Json数据后,页面处理
- <!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>
- <title></title>
- <script src="JS/jquery-1.8.0.min.js" type="text/javascript"></script>
- <script type="text/javascript">
- $(function () {
- $.ajax({
- url: 'jsondata.ashx',
- type: 'GET',
- dataType: 'json',
- timeout: 1000,
- cache: false,
- beforeSend: LoadFunction, //加载执行方法
- error: erryFunction, //错误执行方法
- success: succFunction //成功执行方法
- })
- function LoadFunction() {
- $("#list").html('加载中...');
- }
- function erryFunction() {
- alert("error");
- }
- function succFunction(tt) {
- $("#list").html('');
- //eval将字符串转成对象数组
- //var json = { "id": "10086", "uname": "zhangsan", "email": "zhangsan@qq.com" };
- //json = eval(json);
- //alert("===json:id=" + json.id + ",uname=" + json.uname + ",email=" + json.email);
- var json = eval(tt); //数组
- $.each(json, function (index, item) {
- //循环获取数据
- var name = json[index].Name;
- var idnumber = json[index].IdNumber;
- var sex = json[index].Sex;
- $("#list").html($("#list").html() + "<br>" + name + " - " + idnumber + " - " + sex + "<br/>");
- });
- }
- });
- </script>
- </head>
- <body>
- <ul id="list">
- </ul>
- </body>
- </html>
- <%@ WebHandler Language="C#" Class="jsondata" %>
- using System;
- using System.Web;
- using System.Web.Script.Serialization;
- using System.IO;
- using System.Text;
- using System.Collections.Generic;
- using Newtonsoft.Json;
- using System.Data;
- public class jsondata : IHttpHandler {
- public void ProcessRequest(HttpContext context)
- {
- context.Response.ContentType = "text/plain";
- string JsonStr = JsonConvert.SerializeObject(CreateDT());
- context.Response.Write(JsonStr);
- context.Response.End();
- }
- #region 创建测试数据源
- //创建DataTable
- protected DataTable CreateDT()
- {
- DataTable tblDatas = new DataTable("Datas");
- //序号列
- //tblDatas.Columns.Add("ID", Type.GetType("System.Int32"));
- //tblDatas.Columns[0].AutoIncrement = true;
- //tblDatas.Columns[0].AutoIncrementSeed = 1;
- //tblDatas.Columns[0].AutoIncrementStep = 1;
- //数据列
- tblDatas.Columns.Add("IdNumber", Type.GetType("System.String"));
- tblDatas.Columns.Add("Name", Type.GetType("System.String"));
- tblDatas.Columns.Add("BirthDate", Type.GetType("System.String"));
- tblDatas.Columns.Add("Sex", Type.GetType("System.String"));
- tblDatas.Columns.Add("Wage", Type.GetType("System.Decimal"));
- tblDatas.Columns.Add("Bonus", Type.GetType("System.Decimal"));
- //统计列开始
- tblDatas.Columns.Add("NeedPay", Type.GetType("System.String"), "Wage+Bonus");
- //统计列结束
- tblDatas.Columns.Add("Address", Type.GetType("System.String"));
- tblDatas.Columns.Add("PostCode", Type.GetType("System.String"));
- //设置身份证号码为主键
- tblDatas.PrimaryKey = new DataColumn[] { tblDatas.Columns["IdNumber"] };
- tblDatas.Rows.Add(new object[] { "43100000000000", "张三", "1982", "0", 3000, 1000, null, "深圳市", "518000" });
- tblDatas.Rows.Add(new object[] { "43100000000001", "李四", "1983", "1", 3500, 1200, null, "深圳市", "518000" });
- tblDatas.Rows.Add(new object[] { "43100000000002", "王五", "1984", "1", 4000, 1300, null, "深圳市", "518000" });
- tblDatas.Rows.Add(new object[] { "43100000000003", "赵六", "1985", "0", 5000, 1400, null, "深圳市", "518000" });
- tblDatas.Rows.Add(new object[] { "43100000000004", "牛七", "1986", "1", 6000, 1500, null, "深圳市", "518000" });
- return tblDatas;
- }
- #endregion
- public bool IsReusable
- {
- get
- {
- return false;
- }
- }
- }
- <!--
- <script type="text/javascript">
- $(function () {
- $.ajax({
- url: 'jsondata.ashx',
- type: 'GET',
- dataType: 'json',
- timeout: 1000,
- cache: false,
- beforeSend: LoadFunction, //加载执行方法
- error: erryFunction, //错误执行方法
- success: succFunction //成功执行方法
- })
- function LoadFunction() {
- $("#list").html('加载中...');
- }
- function erryFunction() {
- alert("error");
- }
- function succFunction(tt) {
- $("#list").html('');
- //eval将字符串转成对象数组
- //var json = { "id": "10086", "uname": "zhangsan", "email": "zhangsan@qq.com" };
- //json = eval(json);
- //alert("===json:id=" + json.id + ",uname=" + json.uname + ",email=" + json.email);
- var json = eval(tt); //数组
- $.each(json, function (index, item) {
- //循环获取数据
- var Key = json[index].key;
- var Info = json[index].info;
- // var idnumber = json[index].IdNumber;
- // var sex = json[index].Sex;
- $("#list").html($("#list").html() + "<br>" + Key + "----" + Info.name); //+ " - " + idnumber + " - " + sex + "<br/>");
- });
- }
- });
- </script>
- -->
- <%@ WebHandler Language="C#" Class="jsondata" %>
- using System;
- using System.Web;
- using System.Web.Script.Serialization;
- using System.IO;
- using System.Text;
- using System.Collections;
- using System.Collections.Generic;
- using System.Data;
- public class jsondata : IHttpHandler {
- public void ProcessRequest(HttpContext context)
- {
- context.Response.ContentType = "text/plain";
- context.Response.Cache.SetNoStore();
- string data = "[{\"key\":\"1\",\"info\":{\"name\":\"222\",\"age\":\"333\",\"sex\":\"444\"}},{\"key\":\"2\",\"info\":{\"name\":\"999\",\"age\":\"000\",\"sex\":\"111\"}}]";
- context.Response.Write(new JavaScriptSerializer().Serialize(data));
- }
- public bool IsReusable
- {
- get
- {
- return false;
- }
- }
- }
- <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test2013.aspx.cs" Inherits="Test2013" %>
- <!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 src="JS/jquery-1.8.0.min.js" type="text/javascript"></script>
- <script type="text/javascript">
- function GetPara(o) {
- var sortid = $(o).val();
- $.ajax({
- url: 'GetPara.ashx?type=get&sortid=' + sortid,
- type: 'GET',
- dataType: 'json',
- timeout: 3000,
- cache: false,
- beforeSend: LoadFunction, //加载执行方法
- error: erryFunction, //错误执行方法
- success: succFunction //成功执行方法
- })
- function LoadFunction() {
- $("#list").html('加载中...');
- }
- function erryFunction() {
- alert("error");
- }
- function succFunction(tt) {
- $("#list").html('');
- var json = eval(tt); //数组
- $.each(json, function (index, item) {
- //循环获取数据
- var Id = json[index].id;
- var Name = json[index].name;
- $("#list").html($("#list").html() + "<br>" + Name + "<input type='text' id='" + Id + "' /><br/>");
- });
- }
- };
- function SavePara() {
- var parameter = {};
- $("#list input:text").each(function () {
- var key = $(this).attr("id");
- var value = $(this).val();
- parameter[key] = value;
- });
- $.ajax({
- url: 'GetPara.ashx?type=save',
- type: 'POST',
- dataType: 'json',
- data: parameter,
- timeout: 3000,
- cache: false,
- beforeSend: LoadFunction, //加载执行方法
- error: erryFunction, //错误执行方法
- success: succFunction //成功执行方法
- })
- function LoadFunction() {
- }
- function erryFunction() {
- }
- function succFunction(tt) {
- }
- };
- </script>
- </head>
- <body>
- <form id="form1" runat="server">
- <div>
- <asp:DropDownList ID="ddl1" runat="server" onchange="GetPara(this)">
- </asp:DropDownList>
- <ul id="list"></ul>
- <input type="button" value="保存数据" onclick="SavePara()" />
- </div>
- </form>
- </body>
- </html>
- <%@ WebHandler Language="C#" Class="GetPara" %>
- using System;
- using System.Web;
- using System.Data;
- using System.Collections.Generic;
- using System.Web.Script.Serialization;
- public class GetPara : IHttpHandler {
- public void ProcessRequest (HttpContext context) {
- context.Response.ContentType = "text/plain";
- string SortId = context.Request["sortid"];
- string Type = context.Request["type"];
- if (Type=="get")
- {
- if (!string.IsNullOrEmpty(SortId))
- {
- DataTable dt = MSCL.SqlHelper.GetDataTable("select * from PR_PRODUCTPARAS where sortid='" + SortId + "' ");
- List<Paras> list = new List<Paras>();
- for (int i = 0; i < dt.Rows.Count; i++)
- {
- Paras a = new Paras();
- a.id = dt.Rows[i]["PARAID"].ToString();
- a.name = dt.Rows[i]["PARANAME"].ToString();
- list.Add(a);
- }
- context.Response.Write(new JavaScriptSerializer().Serialize(list));
- }
- }
- else if (Type == "save")
- {
- //反序列化json
- System.IO.Stream stream = context.Request.InputStream;
- System.IO.StreamReader sr = new System.IO.StreamReader(stream, System.Text.Encoding.GetEncoding("UTF-8"));
- string sJson = sr.ReadToEnd();
- if (sJson.Contains("&"))
- {
- string[] sArr = sJson.Split('&');
- for (int i = 0; i < sArr.Length; i++)
- {
- string[] sArr1 = sArr[i].Split('=');
- object id = sArr1[0];
- object value = sArr1[1];
- }
- }
- }
- else
- { }
- }
- public bool IsReusable {
- get {
- return false;
- }
- }
- public struct Paras
- {
- public string id;
- public string name;
- }
- }
【转】Jquery 使用Ajax获取后台返回的Json数据后,页面处理的更多相关文章
- ajax 请求 对json传的处理 Jquery 使用Ajax获取后台返回的Json数据后,页面处理
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Jquery 使用Ajax获取后台返回的Json数据后,页面处理
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- ajax获取后台传递的json数据
最近在使用JQuery的ajax方法时,需要返回的数据为json数据,在success返回中数据处理会根据返回方式不同会采用不同的方式来生成json数据.在$.ajax方法中应该是如何来处理的,简 ...
- JS获取后台返回的JSON数据
问题:通过$.get从后台获取了一段json串{"id":"1","name":"ww"},然后要拿到这里面的id和na ...
- Ajax处理后台返回的Json数据
// 处理后台传来的Json字符串装换成Json对象 var dataJson = JSON.parse(data); // 此时可以从Json对象中取值 if(dataJson.result == ...
- 【转】Jquery ajax方法解析返回的json数据
转自http://blog.csdn.net/haiqiao_2010/article/details/12653555 最近在用jQuery的ajax方法传递接收json数据时发现一个问题,那就是返 ...
- 前台如何处理后台返回的json数据
后台返回的json数据格式: { "state": true, "data": { "id": 0, "name": & ...
- Struts1.x下使用jquery的Ajax获取后台数据
jquery中有多种Ajax方法来获取后台数据,我使用的是$.get()方法,具体的理论我不解释太多,要解释也是从别的地方copy过来的.下面就介绍我的项目中的实现方法. 前台页面: ...
- jquery序列化form表单使用ajax提交后处理返回的json数据
1.返回json字符串: /** 将一个字符串输出到浏览器 */ protected void writeJson(String json) { PrintWriter pw = null; try ...
随机推荐
- 2.EL表达式&JSTL标签库常用方法
1.EL表达式 Expression Language表达式语言,主要是代替jsp页面中的表达式脚本在jsp页面中进行数据的输出. 格式为${表达式} EL表达式输出Bean的普通属性.数组属性.Li ...
- 记一次go中map并发引起的事故
错误使用map引发的血案 前言 场景复原 原因 参考 错误使用map引发的血案 前言 最近业务中,同事使用map来接收返回的结果,使用waitGroup来并发的处理执行返回的结果,结果上线之后,直接崩 ...
- 痞子衡嵌入式:i.MXRT中FlexSPI外设对AHB Burst Read特性的支持
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是FlexSPI外设对AHB Burst Read特性的支持. 痞子衡之前写过一篇关于FlexSPI LUT的文章 <从头开始认识i ...
- JDBC_14_使用JDBC工具类实现模糊查询
使用JDBC工具类实现模糊查询 代码: import java.sql.*; /** * 模糊查询 * 测试DBUtils */ public class JDBCTest09 { public st ...
- 浅谈在c#中使用Zlib压缩与解压的方法
作者:Compasslg 介绍 近期用c#开发一个游戏的存档编辑工具需要用 Zlib 标准的 Deflate 算法对数据进行解压. 在 StackOverflow 上逛了一圈,发现 c# 比较常用到的 ...
- 2021S软件工程——个人阅读作业2
2021S软件工程--个人阅读作业2 项目 内容 这个作业属于哪个课程 2021春季软件工程(罗杰 任建) 这个作业的要求在哪里 个人阅读作业#2 我在这个课程的目标是 了解并熟悉软件开发的具体流程, ...
- php 不定参数的传递
相关函数 func_get_args func_num_args <?php function more_args(){ $args = func_get_args(); for($i=0;$i ...
- 千位分隔符,音频音量加强,transform 垂直居中
1.最近做阴阳师日本官网,其中有个功能是获取预约人数,设计稿上的人数是这样151,567,000,想了想自己写还有点麻烦,于是网上copy了代码,再修改了下. 其中,有一点需要注意的是:函数中的str ...
- Python脚本破解压缩文件口令(zipfile)
环境:Windows python版本2.7.15 Python中操作zip压缩文件的模块是 zipfile . 相关文章:Python中zipfile压缩文件模块的使用 我们破解压缩文件的口令也是用 ...
- APP的编译和反编译
目录 Apktool的准备 Apktool解压APP Apktool打包APP 对APP进行签名