ユーザコントロールがレンダリングされるとJavascriptが正しく機能しないのはなぜですか？

Question

私はHTMLTextWriterとStringWriterを組み合わせて使用​​して、ユーザーコントロールをレンダリングしています。ユーザーコントロールをレンダリングするために使用されるコードは、自分のページのあるJavaScriptからのajax呼び出しによって開始されます。結果のStringWriterテキストはJavaScriptコードに戻され、マイページに追加されます。レンダリングコードは次のようになります。

Dim sw As New System.IO.StringWriter 
If Not IsDBNull(reader.Item("UserControlName")) Then 
    'Use Reflection to create the appropriate class. 
    'First get the type 
    'The usercontrol name is retrieved from my datatable reader 
    Dim htmlcontroltype = Type.GetType("MyProject." & reader.Item("UserControlName")) 
    If Not IsNothing(htmlcontroltype) Then 
     'Create an instance of the class 
     Dim htmlcontrol = Activator.CreateInstance(htmlcontroltype) 
     htmlcontrol = htmlcontrol.LoadControl("~/" & reader.Item("UserControlName") & ".ascx") 
     htmlcontrol.DataBind() 
     Dim tw As New HtmlTextWriter(sw) 
     htmlcontrol.RenderControl(tw) 
    Else 
     sw.Write("No matching User Control was found in the project.") 
    End If 
End If 

Return sw.ToString 

これは私がJavaScriptで素敵な何かをしようとするまでは、正常に動作するように私のユーザーコントロールを返します。

たとえば、Googleのグラフを作成したい場合は、their Javascriptをユーザーコントロールに貼り付けます。ように：

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="TestControl.ascx.vb" Inherits="MyProject.TestControl" %> 
     <script src="http://www.google.com/jsapi" type="text/javascript"></script> 
     <script type="text/javascript"> 
      google.load("visualization", "1", { packages: ["corechart"] }); 
      google.setOnLoadCallback(drawChart); 
      function drawChart() { 
       var data = new google.visualization.DataTable(); 
       [ -- snip! -- ] 
       var chart = new google.visualization.LineChart(document.getElementById('visualization1')); 
       chart.draw(data, { width: 300, height: 250, title: 'Company Performance' }); 
      } 
     </script> 
<div id="visualization1" style="width: 300px; height: 300px;"></div> 

しかし！私がプログラムを実行すると、 "google is undefined"と主張してエラーになります。

これはGoogle Chartsに限らず、Twitter Search APIなどで同様の問題が発生していることに注意してください。また、私のデフォルトまたはマスターページに行を配置すると、違いはありません。

最後に、通常の@Registerディレクティブを使用してデザイン時にユーザーコントロールをマスターページに追加すると、このコードは問題なく動作します。これは、問題がStringWriterによって引き起こされたと考えられる原因となります。誰も似たような問題を経験しているのですか？

Answer 1

問題の原因はわかっていませんが、問題の回避策が見つかりました。 Googleのチャートコードをメインページに配置し、jQuery関数にラップして、ユーザーコントロールが読み込まれたときに呼び出すようにしました。

これは、FirefoxとChromeではiFrameが空に戻ってしまった（ただし、IEでは奇妙なことです）というさらなる問題を引き起こしました。この問題はhereに対処されました。

短いストーリーで、私が好きだったよりも扱いにくいですが、最終結果は同じです。

Answer 2

問題はgoogle.setOnLoadCallbackなどとは思えませんが、そこにはスコープの問題があると思います。これを試してください：

google.setOnLoadCallback(function(){drawChart.call(window)}); 

これは、drawChart関数のコンテキストをgoogle変数にアクセスできるものに明示的に設定します。