在ASP.NET ajax回发中返回javascript失败，但在初始页面加载时工作正常_Asp.net_Ajax_Postback_Highcharts

在ASP.NET ajax回发中返回javascript失败，但在初始页面加载时工作正常

asp.net ajax highcharts

在ASP.NET ajax回发中返回javascript失败，但在初始页面加载时工作正常,asp.net,ajax,postback,highcharts,Asp.net,Ajax,Postback,Highcharts,我有一个包含UpdatePanel和按钮的标准网页。加载页面时，设置一些javascript，页面呈现一个图表（从这里使用Highcharts）当我使用按钮、下拉列表等重新加载UpdatePanel时，图表不会重新呈现对于brewity，我缩短了代码，但通常我有一个带有下拉菜单的UpdatePanel，用户可以在其中选择各种图表，然后从数据库中获取数据，并将结果发送回页面有人能解释一下，当我点击按钮时，为什么它不工作/加载图表-以及如何修复它吗可以在此处下载图表：-只需将其添加到名为/j

我有一个包含UpdatePanel和按钮的标准网页。加载页面时，设置一些javascript，页面呈现一个图表（从这里使用Highcharts）

当我使用按钮、下拉列表等重新加载UpdatePanel时，图表不会重新呈现

对于brewity，我缩短了代码，但通常我有一个带有下拉菜单的UpdatePanel，用户可以在其中选择各种图表，然后从数据库中获取数据，并将结果发送回页面

有人能解释一下，当我点击按钮时，为什么它不工作/加载图表-以及如何修复它吗

可以在此处下载图表：-只需将其添加到名为/js/highcharts.js的文件夹中即可


受保护的无效页面加载（对象发送方、事件参数e）
{
string jschart=“var chart；”（“+up1.ClientID+”）.ready（function（）{chart=new Highcharts.chart（{”
+标题：{text:'Traffic'，x:0，样式：{fontSize:'13px'}}
+“图表：{renderTo:'container'，defaultSeriesType:'column'}，”；
litChartData.Text=String.Format（“{0}{1}”，jschart，getData（））；
}
私有字符串getData（）
{
//这通常来自一个数据库。。。
返回“xAxis:{title:{text:'Date'}，type:'datetime'}，yAxis:{title:{text:'Hits'}，”
+系列：[{名称：'Impressions'，类型：'column'，'
+“数据：[”
+“[UTC日期（2011年7月18日），13]，”
+“[UTC日期（2011年7月24日），21]，”
+“[UTC日期（2011年8月30日），60]”
+ "}] }) });";
}

在jquery的就绪事件发生时，图表在客户端呈现，但在ajax调用时不会重新触发该事件。根据请求是初始请求还是后续请求（ajax），解决方案可能会发出不同的脚本。在初始调用时，只需发出jschart变量中的脚本。在后续调用中，会发出相同的脚本，但不会将其包装到就绪事件绑定中

更新：我完全忘记了更新面板在更新后不执行嵌套脚本。解决方案是通过脚本管理器注册脚本。请尝试以下代码。注意，更新面板中不再有脚本文字

<%@ Page Language="C#" AutoEventWireup="true" EnableViewState="false" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
    string jschart =
             "if (window.chart) { window.chart.destroy(); }" +
             "window.chart = new Highcharts.Chart(" +
             "{title: { text: 'Traffic',x: 0, style: {fontSize:'13px'} }," +
             "chart:{renderTo: 'container', defaultSeriesType: 'column'}," +
             getData() +
             "});";
  ScriptManager.RegisterStartupScript(this, this.GetType(), "chart", jschart, true);
}

private string getData()
{
    // this is normally coming from a database...

    return
        "xAxis:{title:{text:'Date'}, type:'datetime'}, "
        + "yAxis:{title:{text:'Hits'}},"
        + "series:  [{"
        + "name:'Impressions',"
        + "type:'column',"
        + "data:"
        + "[[Date.UTC(2011,7,18),13],"
        + "[Date.UTC(2011,7,24),21],"
        + "[Date.UTC(2011,8,30),60]]"
        + "}]";
}
</script>

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
    <script src="/js/highcharts.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager runat="server" ID="scr" />

    <asp:UpdatePanel ID="up1" runat="server">
    <ContentTemplate> 

        <div id="container" style="width:700px;height:300px;margin:0 auto;background-color:#eee"></div>
        <center><asp:Button ID="btn" runat="server" Text="Ajax postback" /></center>

    </ContentTemplate>
    </asp:UpdatePanel>

    </form>
</body>
</html>


受保护的无效页面加载（对象发送方、事件参数e）
{
字符串jschart=
“如果（window.chart）{window.chart.destroy（）；}”+
“window.chart=新的Highcharts.chart（”+
{title:{text:'Traffic'，x:0，样式：{fontSize:'13px'}}+
图表：{renderTo:'container'，defaultSeriesType:'column'}+
getData（）+
"});";
ScriptManager.RegisterStartupScript（this，this.GetType（），“chart”，jschart，true）；
}
私有字符串getData（）
{
//这通常来自一个数据库。。。
返回
xAxis:{title:{text:'Date'}，类型：'datetime'}
+yAxis:{title:{text:'Hits'}}
+“系列：[{”
+“名称：'印象'，”
+“类型：'列'，”
+“数据：”
+“[[UTC日期（2011,7,18），13]，”
+“[UTC日期（2011年7月24日），21]，”
+“[UTC日期（2011年8月30日），60]”
+ "}]";
}

更新：我完全忘记了更新面板在更新后不执行嵌套脚本。解决方案是通过脚本管理器注册脚本。请尝试以下代码。注意，更新面板中不再有脚本文字

<%@ Page Language="C#" AutoEventWireup="true" EnableViewState="false" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
    string jschart =
             "if (window.chart) { window.chart.destroy(); }" +
             "window.chart = new Highcharts.Chart(" +
             "{title: { text: 'Traffic',x: 0, style: {fontSize:'13px'} }," +
             "chart:{renderTo: 'container', defaultSeriesType: 'column'}," +
             getData() +
             "});";
  ScriptManager.RegisterStartupScript(this, this.GetType(), "chart", jschart, true);
}

private string getData()
{
    // this is normally coming from a database...

    return
        "xAxis:{title:{text:'Date'}, type:'datetime'}, "
        + "yAxis:{title:{text:'Hits'}},"
        + "series:  [{"
        + "name:'Impressions',"
        + "type:'column',"
        + "data:"
        + "[[Date.UTC(2011,7,18),13],"
        + "[Date.UTC(2011,7,24),21],"
        + "[Date.UTC(2011,8,30),60]]"
        + "}]";
}
</script>

<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
    <script src="/js/highcharts.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager runat="server" ID="scr" />

    <asp:UpdatePanel ID="up1" runat="server">
    <ContentTemplate> 

        <div id="container" style="width:700px;height:300px;margin:0 auto;background-color:#eee"></div>
        <center><asp:Button ID="btn" runat="server" Text="Ajax postback" /></center>

    </ContentTemplate>
    </asp:UpdatePanel>

    </form>
</body>
</html>


受保护的无效页面加载（对象发送方、事件参数e）
{
字符串jschart=
“如果（window.chart）{window.chart.destroy（）；}”+
“window.chart=新的Highcharts.chart（”+
{title:{text:'Traffic'，x:0，样式：{fontSize:'13px'}}+
图表：{renderTo:'container'，defaultSeriesType:'column'}+
getData（）+
"});";
ScriptManager.RegisterStartupScript（this，this.GetType（），“chart”，jschart，true）；
}
私有字符串getData（）
{
//这通常来自一个数据库。。。
返回
xAxis:{title:{text:'Date'}，类型：'datetime'}
+yAxis:{title:{text:'Hits'}}
+“系列：[{”
+“名称：'印象'，”
+“类型：'列'，”
+“数据：”
+“[[UTC日期（2011,7,18），13]，”
+“[UTC日期（2011年7月24日），21]，”
+“[UTC日期（2011年8月30日），60]”
+ "}]";
}

我几天来一直在努力完成这项工作，但运气不佳-您（或任何人）是否有一些关于如何完成这项工作的代码示例？我试着用谷歌碰碰运气，但失败了。希望得到一些帮助：）非常感谢-这是我一直在寻找的解决方案。工作完美！如果你来丹麦，我会给你买一杯啤酒：-）我已经尝试了好几天了，但是没有运气-你（或任何人）有没有关于如何做到这一点的代码示例？我试着用谷歌碰碰运气，但失败了。希望得到一些帮助：）非常感谢-这是我一直在寻找的解决方案。工作完美！如果你来丹麦，我会给你买啤酒：-）