Блог

У меня есть UpdatePanel элемент управления на моей странице, который содержит некоторые ASP.NET элементы управления, которые мне нужно связать с элементами управления jQuery ( DatePicker , TimePicker …):

 <script language="javascript" type="text/javascript">

function $(LoadDateAndTimePickers() {

    $("#"   '<%=fromDateTextBox.ClientID%>').datepicker();
    $("#"   '<%=toDateTextBox.ClientID%>').datepicker();
    $("#"   '<%=fromTimeTextBox.ClientID%>').timepicker({ showPeriod: true });
    $("#"   '<%=toTimeTextBox.ClientID%>').timepicker({ showPeriod: true }));

};

</script>
  

В IE это работает нормально. Однако это не работает в Chrome и FireFox, как мой ASP.NET элементы управления находятся внутри UpdatePanel .

Итак, я обработал событие Sys.WebForms.PageRequestManager EndRequest внутри UpdatePanel , чтобы иметь возможность заставить его работать в упомянутых браузерах.

  <asp:UpdatePanel ID="updatePanel" runat="server">
    <ContentTemplate>
        <script  type="text/javascript" language="javascript">
            Sys.WebForms.PageRequestManager.getInstance().
                add_endRequest(LoadDateAndTimePickers)
        </script>

    .....

</asp:UpdatePanel>
  

Это сработало просто отлично. Но на других страницах я размещаю свойASP.NET элементы управления внутри * AJAX ToolKit *, TabContainer элемент управления внутри UpdatePanel . Здесь endRequest обработка перестает работать, даже если я помещаю скрипт обработки внутри TabContainer элемента управления.

Ценю вашу помощь..

Возможно, я еще не понял ваш вопрос, но это просто сработало, когда я попробовал это во всех браузерах, которые поддерживает jquery:

Это мой заголовок содержимого:

     <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <link href="ui/development-bundle/themes/ui-lightness/jquery.ui.all.css" rel="stylesheet"
        type="text/css" />
    <script src="ui/development-bundle/ui/jquery-ui-1.8.12.custom.js" type="text/javascript"></script>
    <script src="ui/development-bundle/ui/jquery.effects.core.js" type="text/javascript"></script>
    <script src="ui/development-bundle/ui/jquery.ui.widget.js" type="text/javascript"></script>
    <script src="ui/development-bundle/ui/jquery.ui.datepicker.js" type="text/javascript"></script>

</asp:Content>
  

и это на странице:

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


<asp:UpdatePanel ID="pnlAjax" runat="server" ClientIDMode="Static">
    <ContentTemplate>
        <asp:TextBox runat="server" ID='txtMyFirstField'></asp:TextBox>
    </ContentTemplate>
</asp:UpdatePanel>


<script type="text/javascript">
    $(function () {
        $("#pnlAjax input").datepicker();
    });
</script>
  

Я предлагаю разместить javascript вне панели обновления.Рендеринг панели обновления не гарантировал, что внутренняя панель javascript будет запущена, и поэтому вы регистрируете EndRequest, чтобы повторно запустить инициализацию javascript после того, как панель обновления обновит его самостоятельно.