RegisterStartupScript not working with UpdatePanel and Google Visualization charts

Question

On my ASP.NET page I am using Google Visualization charts inside of an asp:UpdatePanel. The user selects a chart they want to see from two asp:DropDownLists and then my C# code generates the JavaScript and I then call ScriptManager.RegisterStartipScript(...). When the page first loads the first default chart (i.e. first call to RegisterStartupScript) works and I can view the javascript from View Source. It is only on the postbacks that I get a blank chart and when I then go to View Source the page didn't receive the new JavaScript and it still has the old default JavaScript from the first page load. Here is the weird behavior. If I use the exact same code but replace my Google Chart code with alert(...); then the alert() fires every time and when I view the source the script is there. I've tried may different things and also followed such answers as here. Below is my code and any help would be appreciated, I've had other people look at this and we are all stumped. FYI: If I remove all UpdatePanels and related items (ScriptManager and UpdateProgress) and use ClientScript.RegisterStartupScript() then everything works fine and I get the new JavaScript code on my page and the new chart appears as it should.

<asp:ScriptManager ID="ScriptMgr" runat="server" />

<asp:UpdatePanel ID="UpdatePanelData" runat="server">
    <ContentTemplate> 
        <p>
            <asp:DropDownList ID="PlotList" runat="server" AutoPostBack="true" Width="500px" 
                onselectedindexchanged="PlotList_SelectedIndexChanged"></asp:DropDownList>
            <asp:DropDownList ID="RangeList" runat="server" Width="125px" 
                style="float:right;" AutoPostBack="True" 
                onselectedindexchanged="RangeList_SelectedIndexChanged">
            </asp:DropDownList>
            <br />
            <asp:Label ID="PlotDescription" runat="server" Width="100%"></asp:Label> 
        </p>
        <div id="chart_material" class="GoogleChart" style="width:100%;height:450px;"></div>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="RangeList" EventName="SelectedIndexChanged" />
        <asp:AsyncPostBackTrigger ControlID="PlotList" EventName="SelectedIndexChanged" />
    </Triggers>
</asp:UpdatePanel>

 <asp:UpdateProgress ID="UpdateProgressData" runat="server" DisplayAfter="500">
    <ProgressTemplate>
        <div class="LoadingPanel">
            <asp:Image ID="LoadingImage" runat="server" ImageUrl="~/Images/loading_2.gif" AlternateText="Loading ..." ToolTip="Loading ..." style="padding: 10px;position:fixed;top:45%;left:50%;" />
        </div>
    </ProgressTemplate>
</asp:UpdateProgress>

And my C# code looks like this. The function DisplayPlot is called from the two DropDownList events and each list passes in themselves as 'control'.

private void DisplayPlot(Control control)
    {
        PlotInformation Plot = new PlotInformation(ChartDivID);

        double Range = Convert.ToDouble(RangeList.SelectedValue);

        string JavaScript = Plot.GetPlotScript(PlotList.SelectedItem.Text, Range);

        PlotDescription.Text = Plot.GetDataPlotDescription(PlotList.SelectedItem.Text);

        //string TestScript = "<script type=\"text/javascript\">\n\talert('" + PlotList.SelectedItem.Text + "');\n</script>";

        ScriptManager.RegisterStartupScript(control, control.GetType(), ScriptKey, JavaScript, false);
        //ScriptManager.RegisterStartupScript(control, this.GetType(), ScriptKey, JavaScript, false);

        //if (!ClientScript.IsStartupScriptRegistered(ScriptKey))
        //    ClientScript.RegisterStartupScript(this.GetType(), ScriptKey, JavaScript);
    }

Answer 1

I know this is late, but I spent a lot of time on the same bug.

Try changing:

ScriptManager.RegisterStartupScript(control, control.GetType(), ScriptKey, 
  JavaScript, false);

To

ScriptManager.RegisterStartupScript(UpdatePanelData, UpdatePanelData.GetType(), ScriptKey, 
  JavaScript, false);