我们可以让程序自动刷新.定时向服务器请求数据.5秒取一次数据,10秒取一次数据.
利用XMLHTTP发出请求并取得数据.传到客户端,客户端重新组织并显示数据.
demo.htm 前台显示.
<script language="JavaScript">
function GetResult()
{
/*
*--------------- GetResult() -----------------
* GetResult()
* 功能:通过XMLHTTP发送请求,返回结果.
* 参数:str,字符串,发送条件.
* 实例:GetResult();
*--------------- GetResult() -----------------
*/
var oBao = new ActiveXObject("Microsoft.XMLHTTP");
//特殊字符:+,%,&,=,?等的传输解决办法.字符串先用escape编码的.
//Update:2004-6-1 12:22
oBao.open("POST","Server.asp",false);
oBao.send();
//服务器端处理返回的是经过escape编码的字符串.
var strResult = unescape(oBao.responseText);
//将字符串分开.
var arrResult = strResult.split("###");
RemoveRow(); //删除以前的数据.
//将取得的字符串分开,并写入表格中.
for(var i=0;i<arrResult.length;i++)
{
arrTmp = arrResult[i].split("");
num1 = arrTmp[0]; //字段num1的值
num2 = arrTmp[1]; //字段num2的值
row1 = tb.insertRow();
cell1 = row1.insertCell();
cell1.innerText = num1;
cell2 = row1.insertCell();
cell2.innerText = num2;
}
}
function RemoveRow()
{
//保留第一行表头,其余数据均删除.
var iRows = tb.rows.length;
for(var i=0;i<iRows-1;i++)
{
tb.deleteRow(1);
}
}
function MyShow()
{
//2秒自动刷新一次,2秒取得一次数据.
timer = window.setInterval("GetResult()",2000);
}
</script>
<body >
<p>
</p>
<table width="47%" height="23" border="0" cellpadding="1" cellspacing="0" id="tb">
<tr>
<td>num1</td>
<td>num2</td>
</tr>
</table>
Server.asp 后台读取数据
<% Language="JavaScript" %>
<%
function OpenDB(sdbname)
{
/*
*--------------- OpenDB(sdbname) -----------------
* OpenDB(sdbname)
* 功能:打开数据库sdbname,返回conn对象.
* 参数:sdbname,字符串,数据库名称.
* 实例:var conn = OpenDB("database.mdb");
* author:wanghr100(灰豆宝宝.net)
* update:2004-5-12 8:18
*--------------- OpenDB(sdbname) -----------------
*/
var connstr = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source="+Server.MapPath(sdbname);
var conn = Server.CreateObject("ADODB.Connection");
conn.Open(connstr);
return conn;
}
var sResult = new Array();
var oConn = OpenDB("data.mdb");
//特殊字符:+,%,&,=,?等的传输解决办法.客户端字符是经过escape编码的
//所以服务器端先要经过unescape解码.
//Update:2004-6-1 12:22
var sql = "select num1,num2 from nums order by id";
var rs = oConn.Execute(sql);
while(!rs.EOF)
{
//一条记录用"###"隔开.每列数据用""隔开. 这是以只有两个列数据的情况.
sResult[sResult.length] = rs("num1").Value + "" + rs("num2").Value
rs.MoveNext();
}
//escape解决了XMLHTTP。中文处理的问题.
Response.Write(escape(sResult.join("###")));
%>
数据库data.mdb
表 nums
id,自动编号
num1,文本
num2,文本
测试数据
id num1 num2
1 20.70 20.810
2 10.5 20.5
3 12.3 300
4 132 323
5 563 56
6 20 10
用js+webservice实现无刷新,动态查询数据库阿
例子:
页面:
<INPUT type="button" value="Button" onclick="getdata()"><br>
<span id="div1" class="list"></span>
<script language=javascript>
setInterval(getdata,1000); //动态定时调用
</script>
脚本:
<SCRIPT ID="clientEventHandlersJS" LANGUAGE="javascript">
function getdata()
{
var index=0;
docSubmit =new ActiveXObject("Microsoft.XMLDOM");
docSubmit.async = false;
docSubmit.load("http://localhost/WebApplication1/Service1.asmx/GetData?max
val=5");
docSubmit.loadXML(docSubmit.xml.replace(/</g,"<").replace(/>/g,">"))
;
var s="";
nodeList=docSubmit.documentElement.getElementsByTagName("ds");
for (i=0;i<nodeList.length;i++)
{
s=s+nodeList(i).selectSingleNode("KeShimch").text+'<br>';
}
div1.innerHtml ="";
div1.innerHTML=s;
div1.style.visibility="visible";
}
</script>
注意:
我试了一下,问题在fromework1.0和1.1是有区别的,
在1.1的 machine.config (C:\WINNT\Microsoft.NET\Framework\v1.1.4322\CONFIG),默
认webservice去除了post,get方法
你可在你的 machine.config 中加上 或者 只在 webServices 项目的 Web.config 的<sy
stem.web>里加上:
<webServices>
<protocols>
<add name="HttpPost" />
<add name="HttpGet" />
</protocols>
</webServices>
否则,在ie地址栏输入 webServices 访问地址串时,提示:请求格式无法识别。
还有
docSubmit = new ActiveXObject("MSXML2.DOMDocument"); //1.0
换成
docSubmit =new ActiveXObject("Microsoft.XMLDOM"); //1.1
--------------------------
web服务方法:
[WebMethod]
public string GetData(string maxval)
{
BaseClass.DbManagerSql dbm=new BaseClass.DbManagerSql();
string strSql="select * from s_KeShi where Keshidm>"+maxval;
DataSet ds=dbm.Query(strSql);
return ds.GetXml();
}
返回的xml数据:
<?xml version="1.0" encoding="utf-8" ?>
<string xmlns="http://tempuri.org/">
<NewDataSet>
<ds> <KeShidm>6</KeShidm> <KeShimch>财务部</KeShimch> </ds>
<ds> <KeShidm>7</KeShidm> <KeShimch>政工部</KeShimch> </ds>
<ds> <KeShidm>8</KeShidm> <KeShimch>安质部</KeShimch> </ds>
<ds> <KeShidm>9</KeShidm> <KeShimch>电管部</KeShimch> </ds>
<ds> <KeShidm>10</KeShidm> <KeShimch>运输公司</KeShimch> </ds>
<ds> <KeShidm>11</KeShidm> <KeShimch>局长</KeShimch> </ds>
<ds> <KeShidm>202</KeShidm> <KeShimch>青宁变电站</KeShimch></ds>
</NewDataSet>
</string>
使用FusionCharts的报表工具,动态获取数据,想定时获取新的数据又刷新页面,使用了jquery但是每次都刷新页面。下面是我的代码,应该如何修改呀
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>FusionCharts v3 Documentation</title>
<script language="JavaScript" src="JSClass/FusionCharts.js"></script>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
setInterval(refreshMeetInfo, 5000);
});
$(function refreshMeetInfo() {
var queryStr={};
$.ajax({
type: "post",
url: "data.jsp",
data: queryStr,
dataType: "text",
success: callback
});
function callback(data){
var chart = new FusionCharts("Charts/MSColumn2D.swf", "chart1Id", "800", "600", "0", "0");
chart.setDataXML(data);
chart.render("chartDiv");
}
});
</script>
</head>
<body>
<table width="70%" border="0" cellspacing="0" cellpadding="3" align="center">
<tr>
<td valign="top" class="text" align="center">
<div id="chartdiv" align="center"></div>
</td>
</tr>
</table>
</body>
</html>
http://diqigan.iteye.com/blog/774366
FusionCharts 的刷新
配置数据源的方式有很多种,这里举一个例子:
view plaincopy to clipboardprint?
<html>
<head>
<META HTTP-EQUIV="pragma" CONTENT="no-cache"/>
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"/>
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT"/>
<META HTTP-EQUIV="expires" CONTENT="0"/>
<script language="JavaScript" src="../chart/JSClass/FusionCharts.js" mce_src="chart/JSClass/FusionCharts.js"></script>
</head>
<body bgcolor="#ffffff">
<div id="chartdiv" style= "float:left"></div <script type="text/javascript"><!--
var myChart = new FusionCharts("../chart/Charts/Column3D.swf", "chartid", "360", "230","0","1");
myChart.setDataURL("DataDemo.xml" + "?t="+ new Date().getTime());
myChart.render("chartdiv");
// --></script>
</body>
</html>
<html>
<head>
<META HTTP-EQUIV="pragma" CONTENT="no-cache"/>
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"/>
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT"/>
<META HTTP-EQUIV="expires" CONTENT="0"/>
<script language="JavaScript" src="../chart/JSClass/FusionCharts.js" mce_src="chart/JSClass/FusionCharts.js"></script>
</head>
<body bgcolor="#ffffff">
<div id="chartdiv" style= "float:left"></div <script type="text/javascript"><!--
var myChart = new FusionCharts("../chart/Charts/Column3D.swf", "chartid", "360", "230","0","1");
myChart.setDataURL("DataDemo.xml" + "?t="+ new Date().getTime());
myChart.render("chartdiv");
// --></script>
</body>
</html>
Flash图表无法刷新,开始以为是脚本的bug,后来时间戳帮助我们解决了问题。 时间戳的强大功能,时间戳在许多时候我们可以巧妙的利用。
分享到:
相关推荐
Ajax全新教程 无刷新页面 无刷新数据更新 无刷新绑定 asp.net全新Ajax教程
最近学习Python进行量化交易,第一步是获取实时行情数据,本资源是从新浪财经API接口获取期货实时行情数据的Python源代码(本代码获得的数据不再仅是5分钟行情数据,而是秒级行情更新,行情刷新间隔视网速及获取品种...
1、将form中的数据利用本工具转换成json格式的字符串,再通过ajax传给服务器,从而可以实现无刷新的form提交。; 2、通过AJAX从服务器得到json格式的数据,然后使用本工具解析数据填入form。从而可以实现无刷新的...
通过Ajax技术调用Servlet, 得到需要刷新的数据。
但是有一个问题就是:vuex的存储的数据只是在页面的中,相当于我们定义的全局变量,刷新之后,里边的数据就会恢复到初始化状态。但是这个情况有时候并不是我们所希望的。 比如,用户已经登录了,我把登录状态放到...
提供一个使用AJAX实现无刷新判断注册用户名是否被注册的代码:
一个无刷新三级联动关联DropDownList小例子,一般都能用得到实用的是xml数据源
非常全的关于EXCEL PPT课件,有理论知识,...动态数据源,自动刷新的数据透视表 多数据源数据透视表 数据透视图 该PPT包含了EXCEL中所有类型的图表和数据透视表,是本人花了10天做出的高质量PPT,得到学员的普遍好评!
在做ajax页面无刷新添加的时候,IE下遭遇Ajax缓存,因为刚开始并不知道IE有这个坏毛病,折腾好久,终于解决问题。 总结一下解决办法: 在IE下用Ajax请求某一页面,通常会因为缓存的原因而返回上一次的结果,造成混乱...
而数据仓库中的数据是在对原有分散的数据库数据抽取、清理的基础上经过系统加工、汇总和整理得到的,必须消除源数据中的不一致性,以保证数据仓库内的信息是关于整个企业的一致的全局信息。 相对稳定的:操作型...
(2)集成:指对原有分散的数据库数据经过系统加工, 整理得到的消除源数据中的不一致性。 (3)相对稳定:指一旦某个数据进入数据仓库以后只需要定期的加载、刷新。 (4)反映历史变化:指通过这些信息,对企业的...
此引擎的性能高效,刷新一次全场1500只个股的日k线和盘口数据不超过3秒钟,你就获得了在盘口同时盯住1500个股票的能力!提供的数据包括:K线(月、周、日、60分钟、30分钟、15分钟、5分钟、1分钟);个股基本信息(股本...
- 实时视频数据(最多展示前30期) - 播放量 - 在线观看人数 - 三连数、三连率 - 是否上了热门 ---- ### 系统特点 - 无需登录B站帐号 - 可自定义数据更新间隔 - 支持添加多个Up主数据,可为多个Up主分别设定...
6、通过双击透视表中汇总数据单元格,可以在一个新表中得到该汇总数据的明细数据,对其可以进行格式化、排序或过滤等等常规编辑处理;决不会影响透视表和源数据表本身; 7、以上第6点对源数据是外部数据库的情况尤其...
12.1.2 刷新数据透视表时数据消失了 276 12.1.3 我的数据透视表总是使用“计数”而不使用“求和” 276 12.1.4 我的数据透视表总是将工作簿中的列调整为最适合标题的列宽 276 12.1.5 “推迟布局更新”选项锁住...
12.1.2 刷新数据透视表时数据消失了 276 12.1.3 我的数据透视表总是使用“计数”而不使用“求和” 276 12.1.4 我的数据透视表总是将工作簿中的列调整为最适合标题的列宽 276 12.1.5 “推迟布局更新”选项锁住...
12.1.2 刷新数据透视表时数据消失了 276 12.1.3 我的数据透视表总是使用“计数”而不使用“求和” 276 12.1.4 我的数据透视表总是将工作簿中的列调整为最适合标题的列宽 276 12.1.5 “推迟布局更新”选项锁住...
这款Demo不仅提供了直观的界面设计,还采用了高效的刷新机制,确保用户在浏览数据时能够获得流畅的体验。 该Demo基于Android Studio开发环境构建,充分利用了Android平台提供的各种特性和API,确保了代码的稳定性和...
有些时间,按需求设计,一个窗口中,点击按扭,弹出模式窗口,在模式窗口中,添加完数据后(提交),关闭模式窗口,并且刷新父窗口,而恰恰模式窗口并不支持window.opener,所以无法获得父窗口,也就是说无法在关闭...