使用C#将Javascript添加到ASPX页面

时间:2014-06-27 14:26:30

标签: c# javascript asp.net

我有一些Javascript代码,我想将它添加到Default.aspx.cs中的页面。

我尝试了以下内容:

string sb = @" <script type='text/javascript'>
        var chart;

        var chartData = [{'year': 2005,'income': 23.5,'expenses': 18.1},
            {'year': 2006,'income': 26.2,'expenses': 22.8},
            {'year': 2007, 'income': 30.1, 'expenses': 23.9 },
            {'year': 2008,'income': 29.5,'expenses': 25.1},
            {'year': 2009,'income': 24.6,'expenses': 25}
            ];  
            AmCharts.ready(function () {
            chart = new AmCharts.AmSerialChart();
            chart.dataProvider = chartData;
            chart.categoryField = 'year';
            chart.startDuration = 1;
            chart.plotAreaBorderColor = '#DADADA';
            chart.plotAreaBorderAlpha = 1;chart.rotate = true;var categoryAxis = chart.categoryAxis;
            categoryAxis.gridPosition = 'start';
            categoryAxis.gridAlpha = 0.1;
            categoryAxis.axisAlpha = 0;var valueAxis = new AmCharts.ValueAxis();
            valueAxis.axisAlpha = 0;
            valueAxis.gridAlpha = 0.1;
            valueAxis.position = 'top';
            chart.addValueAxis(valueAxis);
            var graph1 = new AmCharts.AmGraph();
            graph1.type = 'column';
            graph1.title = 'Income';
            graph1.valueField = 'income';
            graph1.balloonText = 'Income:[[value]]';
            graph1.lineAlpha = 0;
            graph1.fillColors = '#ADD981';
            graph1.fillAlphas = 1;
            chart.addGraph(graph1);
            var graph2 = new AmCharts.AmGraph();
            graph2.type = 'column';
            graph2.title = 'Expenses';
            graph2.valueField = 'expenses';
            graph2.balloonText = 'Expenses:[[value]]';
            graph2.lineAlpha = 0;
            graph2.fillColors = '#81acd9';
            graph2.fillAlphas = 1;
            chart.addGraph(graph2);var legend = new AmCharts.AmLegend();
            chart.addLegend(legend); chart.creditsPosition = 'top-right';
            chart.write('chartdiv');
        });
    </script>";


        ScriptManager.RegisterStartupScript(this.Page,
          this.GetType(), "MyFun1", sb, false);

代码在直接添加到aspx页面时有效,但是当我尝试这个并尝试任何其他代码时,我无法在我的页面上运行它。

我将填充数据库中的值。所以它必须是动态的

编辑:我解决了这个问题。我在页面上添加了一个标签并编写了这段代码

        Label5.Text = sb;

1 个答案:

答案 0 :(得分:1)

问题是代码有注释。在渲染到浏览器时,它会使某些javascript代码无效,因此请删除这些注释并重试。

对于调试,您可以尝试首先将脚本渲染为 Literal 控件,并在控制台中查看任何脚本错误。

string sb = @" <script type='text/javascript'>
    var chart;
    var chartData = [{ 'year': 2005, 'income': 23.5,'expenses': 18.1},
    AmCharts.ready(function () {
        chart = new AmCharts.AmSerialChart(); 
        chart.dataProvider = chartData;                
        chart.categoryField = 'year'; 
        chart.startDuration = 1; 
        chart.plotAreaBorderColor = '#DADADA'; 
        chart.plotAreaBorderAlpha = 1; 
        chart.rotate = true;
        var categoryAxis = chart.categoryAxis;                
        categoryAxis.gridPosition = 'start';                
        categoryAxis.gridAlpha = 0.1;                
        categoryAxis.axisAlpha = 0;
        var valueAxis = new AmCharts.ValueAxis();
        valueAxis.axisAlpha = 0;
        valueAxis.gridAlpha = 0.1;
        valueAxis.position = 'top';
        chart.addValueAxis(valueAxis);
        var graph1 = new AmCharts.AmGraph();                
        graph1.type = 'column';                
        graph1.title = 'Income';                
        graph1.valueField = 'income';                
        graph1.balloonText = 'Income:[[value]]';                
        graph1.lineAlpha = 0;                
        graph1.fillColors = '#ADD981';graph1.fillAlphas = 1;               
        chart.addGraph(graph1);
        var graph2 = new AmCharts.AmGraph();               
        graph2.type = 'column';                
        graph2.title = 'Expenses';                
        graph2.valueField = 'expenses';                
        graph2.balloonText = 'Expenses:[[value]]';                
        graph2.lineAlpha = 0;                
        graph2.fillColors = '#81acd9';               
        graph2.fillAlphas = 1;      
        chart.addGraph(graph2);
        var legend = new AmCharts.AmLegend();                
        chart.addLegend(legend);                
        chart.creditsPosition = 'top-right'; 
        chart.write('chartdiv');            
    });  
    </script>";


ScriptManager.RegisterStartupScript(this.Page, 
  this.GetType(), "MyFun1", sb, false);