Javascript日期时间选择器在asp.net中回发后不工作

本文关键字:工作 net 时间 日期 选择器 asp Javascript | 更新日期: 2023-09-27 18:01:04

在更新面板中有一个包含用户控件的页面。

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
----
----
<div id="dtBox"></div>             
            <script type="text/javascript">                
                $(document).ready(function () {
                    $("#dtBox").DateTimePicker({
                        dateFormat: "yyyy-MM-dd",
                        timeFormat: "hh:mm AA",
                        dateTimeFormat: "yyyy-MM-dd hh:mm:ss AA"
                    }); 
                });               
            </script>
 <asp:TextBox ID="abc" data-field="date" data-view="Dropdown" data-format="MM-dd-yyyy" runat="server"></asp:TextBox>
---
---
</ContentTemplate>
    </asp:UpdatePanel>

$(document).ready(function() ) {}在页面首次加载时被调用并正确执行代码,但如果用户单击按钮(在用户控件内(,则不会调用document.ready((。我正在使用CuriousSolutions DateTimePicker

Javascript日期时间选择器在asp.net中回发后不工作

试试这个脚本,希望它能工作。

        $(document).ready(function() {
            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
            function EndRequestHandler(sender, args) {
                $("#dtBox").DateTimePicker({
                        dateFormat: "yyyy-MM-dd",
                        timeFormat: "hh:mm AA",
                        dateTimeFormat: "yyyy-MM-dd hh:mm:ss AA"
                    }); 
            }
        });

每次重新创建日期时间选择器时,您都需要对其进行初始化,即每次回发和刷新包装日期选择器的更新面板时。

把它包装在文档中。ready意味着它只会发生一次。

一种简单的方法是将初始化代码移动到控件后面,而不将其包装在$(document(.ready中。或者,正确的方法是侦听返回完整的javascript事件并重新初始化日期选择器。