Question

我想在用户点击日历组件后显示此div。在这里，调用javascript函数来显示这个，但div内容不会出现在日历上

如果没有此脚本管理器标记和时间选择器标记，它将正确显示。

请帮忙吗？

    <div class="event" id="eventWindow" style="display: none; width: 400px; height: 250px">

        <asp:Label ID="Label4" runat="server" Text="Event Time" style="z-index: 1; left: 38px; top: 13px; position: absolute; height: 18px; width: 116px;"></asp:Label>
        <br />
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 

         <cc1:TimeSelector ID="TimeSelector1" runat="server" style="z-index: 1; left: 37px; top: 31px; position: absolute; height: 40px; width: 124px" DisplaySeconds="False">
        </cc1:TimeSelector>

        <br />
        <br />
        <asp:Label ID="Label2" runat="server" Text="Enter Event"></asp:Label>
        <br />

Java脚本调用.......

protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        string day = Convert.ToString(Calendar1.SelectedDate);
        string  [] date = day.Split(' ');

        var events = from cal in db.CalenderEvents
                     where cal.eventDate == date[0]
                     select cal.eventDescription;


        if (events.Count() == 0)
        {
            string js = @"document.getElementById('eventWindow').style.display = 'block'";
            ScriptManager.RegisterStartupScript(Calendar1,this.GetType(), "myalert", js, true);          


        }

}

Answer 1

好的，我想我明白你在这里要做什么。如果当天没有活动，您只需要为日历中选择的每一天添加一个活动。如果我是对的你所做的是错的。您只是注册了一段JS代码，但您从未将它附加到onClick或onLoad等事件上。所以我的建议如下。

通过添加runat="server"
不是注册JS代码而是使用DIV的Visible属性使其可见（从此DIV的样式属性中删除display: none;）

这是一个工作样本

Marckup代码

<asp:Calendar ID="Calendar1" runat="server" onselectionchanged="Calendar1_SelectionChanged"></asp:Calendar>
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
    <div class="event" id="eventWindow" style="width: 400px; height: 250px" runat="server"> 
        <asp:Label ID="Label4" runat="server" Text="Event Time" style="z-index: 1; left: 38px; top: 13px; height: 18px; width: 116px;"></asp:Label>
        <br />       
         <cc1:TimeSelector ID="TimeSelector1" runat="server" style="z-index: 1; left: 37px; top: 31px; height: 40px; width: 124px" DisplaySeconds="False">
        </cc1:TimeSelector>
        <br />
        <br />
        <asp:Label ID="Label2" runat="server" Text="Enter Event"></asp:Label>
        <br />
    </div>

注意：我已从样式属性中删除了位置属性，因为控件显示在Calendar控件的顶部。

代码背后

protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        string day = Convert.ToString(Calendar1.SelectedDate);
        string[] date = day.Split(' ');

        var events = from cal in db.CalenderEvents
                     where cal.eventDate == date[0]
                     select cal.eventDescription;


        if (events.Count() == 0)
        {
            //string js = @"document.getElementById('eventWindow').style.display = 'block'";
            //ScriptManager.RegisterStartupScript(Calendar1, this.GetType(), "myalert", js, true);

            eventWindow.Visible = true;

        }
    }

带有timepicker的脚本管理器

1 个答案: