因为之前帮WM组做了一个delivery的dashboard,大概用了3周的时间,.net也忘了差不多了,ajax和highchart表也是现学的,蛮费劲!总算也搞出来了。发帖纪录一下。

1. 前台ASPX页面<Javascript>(下面ajax的代码可以存在与某个JS事件中触发,将其包含在事件代码里)

$.getJSON("Handler4.ashx", {"param": a, "param1":b },
function (data) {
$.each(data, function (i, item) {
bar_version.push(item["version"]);
bar_value.push(item["vamount"]);
$.each(item, function (k, v) {
});
});

param 和param1将a和b的值传入后台。

2. ashx.cs - handler 

string param = HttpContext.Current.Request["param"];

将param 值传入handler cs 后台,将某个list参数JSON序列化(使用newtonsoft包)

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

更多关于newtonsoft的信息:

http://www.newtonsoft.com/json

3. 将后台JSON数据传入前台

$.getJSON("Handler4.ashx", {"param": a, "param1":b },
function (data) {//红色data变量是从后台JSON格式的变量strJson                    
$.each(data, function (i, item) { //通过each函数,将JSON格式的数据读出来.
bar_version.push(item["version"]);
bar_value.push(item["vamount"]);
$.each(item, function (k, v) {
});
});

效果图(图是由highcharts来画的):

ASP.NET&AJAX&JSON - 动态读取数据的更多相关文章

  1. ajax获取动态列表数据后的分页问题

    ajax获取动态列表数据后的分页问题 这是我在写前台网站时遇到的一个分页问题,由于数据是通过ajax的方式来请求得到的,如果引入相应的js文件来做分页,假如只是静态的填放数据到列表各项内容中(列表条数 ...

  2. Highcharts使用简例 + 异步动态读取数据

    第一部分:在head之间加载两个JS库. <script src="html/js/jquery.js"></script> <script src= ...

  3. asp.net+Sqlserver 通过存储过程读取数据

    Sqlserver代码  创建存储过程如下: /*根据父id获取类别总数*/ IF EXISTS (SELECT name FROM sysobjects WHERE name = N'getsite ...

  4. echarts在miniUI和ajax下动态渲染数据

    <script src="echarts.js"></script> <script src="jquery-3.3.1.min.js&qu ...

  5. springboot~openfeign从JSON文件读取数据

    对openfeign不清楚的同学可以先看我这篇文章:springboot~openfeign从此和httpClient说再见 对于openfeign来说,帮助我们解决了服务端调用服务端的问题,你不需要 ...

  6. 通过jquery,从json中读取数据追加到html中

    1.下载安装jquery   可通过下面的方法引入在线版本的js: <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jque ...

  7. php动态读取数据清除最右边距

    需求效果一行3栏: 场景模拟:同事给了我这么一段静态代码如下: <!DOCTYPE html> <html lang="en"> <head> ...

  8. [转]ASP.NET MVC Json()处理大数据异常解决方法 json maxjsonlength

    本文转自:http://blog.csdn.net/blacksource/article/details/18797055 先对项目做个简单介绍: 整个项目采用微软的ASP.NET MVC3进行开发 ...

  9. ASP.NET MVC Json() 处理大数据异常解决方法 json MaxJsonLength

    网上很多解决方案,在webconfig中添加,但是实践证明无效 <system.web.extensions> <scripting> <webServices> ...

随机推荐

  1. 可视化日志分析工具Gltail的安装与使用

    可视化日志分析工具Gltail的安装与使用      GlTail.rb 是一款带有浓郁的 Geek 风格的可视化日志分析工具,它采用 Ruby 技术构建,并利用 OpenGL 图形技术进行渲染,呈现 ...

  2. KVM: 安装Windows virtio半虚拟化驱动

    Install KVM Windows virtio para-virtualized dirver If you can't read Chinese, there's an English ver ...

  3. Linux内核中ioremap映射的透彻理解

    几乎每一种外设都是通过读写设备上的寄存器来进行的,通常包括控制寄存器.状态寄存器和数据寄存器三大类,外设的寄存器通常被连续地编址.根据CPU体系结构的不同,CPU对IO端口的编址方式有两种: (1)I ...

  4. 苹果系列机型专业刷机,解锁,解ID

    如有软件开发需求,请留言或在猪八戒网主页留言http://home.zhubajie.com/8506525/,常年接收c.c++(vs2010.RAD studio xe5\RAD studio 2 ...

  5. SQL 数据库 复制 与订阅 实现数据同步

    摘自: http://www.jb51.net/article/18039.htm

  6. Volume serial number could associate file existence on certain volume

    When it comes to lnk file analysis, we should put more emphasis on the volume serial number. It coul ...

  7. myeclipse上SVN代码合并详细步骤图解

    1.  在装有svn插件的myeclipse中,在主干上选择需要合并的文件或文件夹 右击 -> 合并(merge) 2. 选择合并类型--合并两个不同的树 Merge -> Next 3. ...

  8. 003Linux网络配置

    基于VMware中的Linux系统: 1.VMware提供了三种网络工作模式: (1)bridged(桥接模式) 桥接模式,顾名思义,得有桥,谁充当桥呢?当然是主机,安装了虚拟机的主机,充当的是虚拟机 ...

  9. C puzzles详解【26-30题】

    第二十六题(不会) The following is a simple program which implements a minimal version of banner command ava ...

  10. CentOS 5.x版本升级Mysql

    #-----------------------------CentOS 5.x版本升级Mysql ------------------#! /bin/sh #1.关闭selinuxcp -rp /e ...