Почему Javascript не работает должным образом, когда мой пользовательский элемент управления отображается? - PullRequest
Новая
       41

Почему Javascript не работает должным образом, когда мой пользовательский элемент управления отображается?

1 голос
/ 23 июня 2011

Я использую комбинацию HTMLTextWriter и StringWriter для рендеринга своих пользовательских элементов управления. Код, используемый для визуализации пользовательского элемента управления, инициируется с помощью вызова ajax из некоторого Javascript на моей странице. Полученный текст 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, я вставляю их 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 не определен».

Важно отметить, что это не ограничивается Google Charts - у меня были похожие проблемы с API поиска в Twitter и другими. Также размещение строки
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
в моей странице по умолчанию или главной странице нет никакой разницы.

Наконец, этот код будет работать без проблем, если пользовательский элемент управления будет добавлен на мою главную страницу во время разработки, используя обычную директиву @Register - и я уверен, что проблема вызвана StringWriter. Кто-нибудь сталкивался с подобной проблемой или может пролить свет на эту тему?

Ответы [ 2 ]

1 голос
/ 23 июня 2011

Я не думаю, что проблема связана с google.setOnLoadCallback и т. Д., Я думаю, у вас есть проблема с ограничением объема. Попробуйте это: 

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

Это явно установит контекст функции drawChart на что-то, имеющее доступ к переменной Google.

0 голосов
/ 24 июня 2011

Я нашел способ обойти эту проблему, хотя до сих пор не знаю, что ее вызвало.Я поместил код своей диаграммы Google на свою главную страницу и обернул ее в функцию jQuery, вызывая ее при загрузке пользовательского элемента управления.

Это привело к еще одной проблеме, когда iFrame вернулся пустым в Firefox и Chrome(но не в IE, странно).Эта проблема была решена здесь .

Короче говоря, это грязнее, чем мне бы хотелось, но конечный результат тот же.

...