Неопределенная ошибка IE9 Javascript

ProgramBox

Неопределенная ошибка IE9 Javascript

Post author:admin
Запись опубликована:18 мая, 2023
Post category:Вопросы по программированию

#javascript #asp.net #internet-explorer

Вопрос:

Я получаю ошибку javascript в IE9, которую я не получаю в Chrome или FF, и я не могу найти хороший способ ее решения. Код действительно работает в режиме совместимости.

В примере кода у меня есть пользовательский элемент управления, который состоит из нескольких базовых элементов управления и AJAX modelpopupextender. В listview заполняются некоторые продукты, и я прикрепляю событие onclick onitemdatabound, которое заполняет метку и закрывает modelpopup для каждого htmlrow элементов listview.

IE9 не может найти Button2 и не завершает функцию javascript. Текущие версии Chrome и FF работают так, как задумано. Я чего-то не понимаю?

Источник:

 <%@ Control Language="VB" AutoEventWireup="false" CodeFile="SelectProduct.ascx.vb" Inherits="SelectProduct" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<style type="text/css">
.modalBackground 
{
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}
</style>
<asp:Panel ID="Panel1" runat="server" BackColor="Wheat">    
    <table style="padding:5px;">
        <tr>
            <td style="width:40px;">amp;nbsp;</td>
            <td style="width:400px;text-align:center;">
                <b style="font-size:12pt;color:#155184;">Select a Product</b>
            </td>
            <td style="width:40px;text-align:right;">
                <asp:Button ID="Button2" runat="server" Text="X" CausesValidation="false" />
            </td>
        </tr>
    </table>
    <asp:Panel ID="Panel2" runat="server" Height="500" ScrollBars="Auto" BackColor="White">
        <table style="padding:5px;">
            <tr>
                <td colspan="3">
                    <asp:ListView ID="ListView1" runat="server" DataSourceID="sqlProducts" DataKeyNames="productid, productname">
                        <LayoutTemplate>
                            <table cellpadding="4" cellspacing="0" style="width:480px;border:solid 1px #cccccc;" rules="all">
                                <tr>
                                    <th style="width:100px;">ID</th>
                                    <th style="width:280px;">Name</th>
                                    <th style="width:100px;">Price</th>
                                </tr>
                                <tr id="itemPlaceHolder" runat="server"></tr>
                            </table>
                        </LayoutTemplate>
                        <ItemTemplate>
                                <tr id="selectedProduct" runat="server" style="cursor:pointer;">
                                    <td style="width:100px;text-align:center;">
                                        <asp:Label ID="lblID" runat="server" Text='<%# Eval("productid") %>' />
                                    </td>
                                    <td style="width:280px;text-align:center;">
                                        <asp:Label ID="lblName" runat="server" Text='<%# Eval("productname") %>' />
                                    </td>
                                    <td style="width:100px;padding-left:4px;">
                                        <asp:Label ID="lblPrice" runat="server" Text='<%# Eval("unitprice") %>' />
                                    </td>
                                </tr>
                        </ItemTemplate>
                    </asp:ListView>
                    <asp:SqlDataSource ID="sqlProducts" runat="server" 
                        ConnectionString="<%$ ConnectionStrings:Northwind %>" 
                        SelectCommand="select productid, productname, unitprice from products">
                    </asp:SqlDataSource>
                </td>
            </tr>
        </table>  
    </asp:Panel>
</asp:Panel>
<asp:Button ID="Button1" runat="server" Text="Select a Product..." CausesValidation="false" />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
<asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" BackgroundCssClass="modalBackground" 
    PopupControlID="Panel1" TargetControlID="Button1" CancelControlID="Button2">
</asp:ModalPopupExtender>

Код:

 Partial Class SelectProduct
    Inherits System.Web.UI.UserControl

    Protected Sub ListView1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ListViewItemEventArgs) Handles ListView1.ItemDataBound

        Dim row As HtmlTableRow = CType(e.Item.FindControl("selectedProduct"), HtmlTableRow)
        Dim product As String = ListView1.DataKeys(CType(e.Item, ListViewDataItem).DataItemIndex).Values(1).ToString()
        Dim id As String = ListView1.DataKeys(CType(e.Item, ListViewDataItem).DataItemIndex).Values(0).ToString()
        row.Attributes.Add("onclick", Label1.ClientID   ".innerText="""   product   """;"   Button2.ClientID   ".click();")

    End Sub
End Class

Сгенерированный HTML:

 <div>
    <style type="text/css">
        .modalBackground
        {
            background-color: Gray;
            filter: alpha(opacity=70);
            opacity: 0.7;
        }
    </style>
    <div id="SelectProduct1_Panel1" style="background-color: Wheat;">
        <table style="padding: 5px;">
            <tr>
                <td style="width: 40px;">
                    amp;nbsp;
                </td>
                <td style="width: 400px; text-align: center;">
                    <b style="font-size: 12pt; color: #155184;">Select a Product</b>
                </td>
                <td style="width: 40px; text-align: right;">
                    <input type="submit" name="SelectProduct1$Button2" value="X" id="SelectProduct1_Button2" />
                </td>
            </tr>
        </table>
        <div id="SelectProduct1_Panel2" style="background-color: White; height: 500px; overflow: auto;">
            <table style="padding: 5px;">
                <tr>
                    <td colspan="3">
                        <table cellpadding="4" cellspacing="0" style="width: 480px; border: solid 1px #cccccc;"
                            rules="all">
                            <tr>
                                <th style="width: 100px;">
                                    ID
                                </th>
                                <th style="width: 280px;">
                                    Name
                                </th>
                                <th style="width: 100px;">
                                    Price
                                </th>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl0_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Chaiamp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl0_lblID">1</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl0_lblName">Chai</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl0_lblPrice">18.0000</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl1_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Changamp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl1_lblID">2</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl1_lblName">Chang</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl1_lblPrice">19.0000</span>
                                </td>
                            </tr>                                
                            <tr id="SelectProduct1_ListView1_ctrl69_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Outback Lageramp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl69_lblID">70</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl69_lblName">Outback Lager</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl69_lblPrice">15.0000</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl70_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Flotemysostamp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl70_lblID">71</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl70_lblName">Flotemysost</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl70_lblPrice">21.5000</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl71_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Mozzarella di Giovanniamp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl71_lblID">72</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl71_lblName">Mozzarella di Giovanni</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl71_lblPrice">34.8000</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl72_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Röd Kaviaramp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl72_lblID">73</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl72_lblName">Röd Kaviar</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl72_lblPrice">15.0000</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl73_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Longlife Tofuamp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl73_lblID">74</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl73_lblName">Longlife Tofu</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl73_lblPrice">10.0000</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl74_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Rhönbräu Klosterbieramp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl74_lblID">75</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl74_lblName">Rhönbräu Klosterbier</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl74_lblPrice">7.7500</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl75_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Lakkalikööriamp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl75_lblID">76</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl75_lblName">Lakkalikööri</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl75_lblPrice">18.0000</span>
                                </td>
                            </tr>
                            <tr id="SelectProduct1_ListView1_ctrl76_selectedProduct" style="cursor: pointer;"
                                onclick="SelectProduct1_Label1.innerText=amp;quot;Original Frankfurter grüne Soßeamp;quot;;SelectProduct1_Button2.click();">
                                <td style="width: 100px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl76_lblID">77</span>
                                </td>
                                <td style="width: 280px; text-align: center;">
                                    <span id="SelectProduct1_ListView1_ctrl76_lblName">Original Frankfurter grüne Soße</span>
                                </td>
                                <td style="width: 100px; padding-left: 4px;">
                                    <span id="SelectProduct1_ListView1_ctrl76_lblPrice">13.0000</span>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
        </div>
    </div>
    <input type="submit" name="SelectProduct1$Button1" value="Select a Product..." id="SelectProduct1_Button1" />
    <span id="SelectProduct1_Label1"></span>
</div>

Обновить:

Хорошо, я нашел обходной путь. Я добавил функцию js, которая выполняет процессы.

 <script type="text/javascript">
    function selectProduct(prodName) {
        document.getElementById('<%= Label1.ClientID %>').innerText = prodName;
        document.getElementById('<%= Button2.ClientID %>').click();
    }
</script>

…

 Dim row As HtmlTableRow = CType(e.Item.FindControl("selectedProduct"), HtmlTableRow)
Dim lblName As Label = e.Item.FindControl("lblName")
Dim product As String = ListView1.DataKeys(CType(e.Item, ListViewDataItem).DataItemIndex).Values(1).ToString()
Dim id As String = ListView1.DataKeys(CType(e.Item, ListViewDataItem).DataItemIndex).Values(0).ToString()
row.Attributes.Add("onclick", "selectProduct("   lblName.ClientID   ".innerText);")

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

По крайней мере, я заставил это работать.

1. Какой HTML генерируется для FF / Chrome? asp.net угадывает, какой у вас браузер, и адаптирует HTML, который он генерирует. Возможно, вам потребуется обновленный файл возможностей браузера для IE9 в стандартном режиме.

Ответ №1:

Возможно, вы захотите попробовать изменить:

 row.Attributes.Add("onclick", Label1.ClientID   ".innerText="""   product   """;"   Button2.ClientID   ".click();")

Для:

 row.Attributes.Add("onclick", Label1.ClientID   ".innerText="""   product   """;document.getElementById("""   Button2.ClientID   """).click();")

1. Не могу поклясться, что это ответ на эту конкретную проблему, но я столкнулся с некоторыми подобными ошибками, которые были решены таким образом. До такой степени, что getElementById теперь является моим стандартным подходом.

2. Я пробовал это, но это не устранило проблему. IE9 по-прежнему не может найти Button2.

Ответ №2:

У меня аналогичная проблема с пользовательским WebControl. Я проследил проблему до ASP.NET .

Короче говоря, ASP.NET не знает об идентификаторе браузера IE9, таким образом возвращая флаги совместимости по умолчанию, включая EcmaScriptVersion (см. System.Web.HttpContext.Current.Запрос.Браузер), которая отключает генерацию скрипта в базовом классе.

Я действительно надеялся, что они обновятся.чистая после выпуска IE9, но нет.

Это (независимые) решения, которые я использовал, чтобы обойти это раздражение:

Включите представление совместимости на странице с элементом управления (см. X-UA-Compatible), предпочтительно в виде мета-тега, чтобы принудительно перезагрузить страницу;

Добавьте browserCaps раздел к вашему web.config (это эффективно включит cookies и javascript для всех браузеров):

 <configuration>
    <system.web>
        <browserCaps>
            <use var="HTTP_USER_AGENT" />
            browser=Unknown
            cookies=true
            javascript=true
            ecmascriptversion=1.0
        </browserCaps>
    </system.web>
</configuration>

Найдите, как заставить элемент управления генерировать требуемые сценарии, несмотря ни на что (этот все еще находится на рассмотрении).