我有一个数组,我从我的数据库中存储的数字(数字是8.00和9.00)在c#中的page_load中,我希望将其传递给JavaScript以绘制高图表。我按照Stack溢出给出的所有示例但我会得到错误。我做错了吗?
C#
using System;
using System.Collections;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Web.Script.Serialization;
public partial class Highchart : System.Web.UI.Page
{
public String _Result { get; set; }
protected void Page_Load(object sender, EventArgs e)
{
//Set the course object here
ArrayList Course = new ArrayList();
const string connectionString = "Data Source=localhost;" + "Initial Catalog=IBBTS_DB; Integrated Security =SSPI";
const string query = "SELECT X from accelerometerReading";
using (SqlConnection cn = new SqlConnection(connectionString))
{
using (SqlCommand cm = new SqlCommand(query, cn))
{
cn.Open();
SqlDataReader reader = cm.ExecuteReader();
while (reader.Read())
{
Course.Add(reader.GetDecimal(0));
}
}
}
_Result = new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(Course);
}
}
的JavaScript
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>
<script type="text/javascript" src="~/js/highcharts.js"></script>
<script type="text/javascript" src="~/js/modules/exporting.js"></script>
<div id="container" style="width:100%; height:400px;">
<script type="text/javascript">
$(function () {
$('#container').highcharts({
title: {
text: 'Monthly Average Temperature',
x: -20 //center
},
subtitle: {
text: 'Source: WorldClimate.com',
x: -20
},
xAxis: {
categories: ['Jan', 'Feb']
},
yAxis: {
title: {
text: 'Temperature (°C)'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: '°C'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
<% var serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); %>
var jsVariable = <%= serializer.Serialize(Course) %>;
series: [{
name: 'X axis',
data: jsVariable
}, {
name: 'Y Axis',
data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
}]
});
});
</script>
编译时我会得到一个空白页。
这是带有
行的更新版本 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Highchart.aspx.cs" Inherits="Highchart" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>
<script type="text/javascript" src="~/js/highcharts.js"></script>
<script type="text/javascript" src="~/js/modules/exporting.js"></script>
<div id="container" style="width:100%; height:400px;">
<script type="text/javascript">
$(function () {
$('#container').highcharts({
title: {
text: 'Monthly Average Temperature',
x: -20 //center
},
subtitle: {
text: 'Source: WorldClimate.com',
x: -20
},
xAxis: {
categories: ['Jan', 'Feb']
},
yAxis: {
title: {
text: 'Temperature (°C)'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: '°C'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
var javaVariable = <%= _Result %>
series: [{
name: 'X axis',
data: javaVariable
}, {
name: 'Y Axis',
data: [-0.2, 0.8]
}]
});
});
</script>
</div>
</form>
</body>
</html>
答案 0 :(得分:1)
尝试为此创建一个名为“_Result”的属性:
在代码背后:
//Add this line
public String _Result {get;set;}
protected void Page_Load(object sender, EventArgs e)
{
//Set the course object here
ArrayList Course = new ArrayList();
const string connectionString = "Data Source=localhost;" + "Initial Catalog=IBBTS_DB; Integrated Security =SSPI";
const string query = "SELECT X from accelerometerReading";
using (SqlConnection cn = new SqlConnection(connectionString))
{
using (SqlCommand cm = new SqlCommand(query, cn))
{
cn.Open();
SqlDataReader reader = cm.ExecuteReader();
while (reader.Read())
{
Course.Add(reader.GetDecimal(0));
}
}
}
_Result = new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(Course);
}
然后在标记页面中:
var javaVariable = <%= _Result %>
此错误消息显示因为“课程”不是全局变量,因此标记页无法访问“课程”对象。