textbox获得焦点的时候弹出控件，失去焦点的时候隐藏控件

Question

我实现了这个功能，但是控件里面的内容select不了我弹出的控件是<asp:Calendar>
下面附上代码：                                    <asp:TextBox ID="SearchEDate" runat="server" CssClass="TextInput" ></asp:TextBox>
                                    <asp:CompareValidator id="CompareValidator3" runat="server" ErrorMessage="<br>Please input the right type of date(YYYY-MM-DD)" Display="Dynamic"
ControlToValidate="SearchEDate" Operator="DataTypeCheck" Type=Date></asp:CompareValidator>
                                    <asp:CompareValidator id="CompareValidator5" runat="server" ErrorMessage="<br>The end date must be greater than the starting date" Display="Dynamic" 
                                    ControlToCompare="SearchDate" ControlToValidate="SearchEDate" Operator=GreaterThan Type=Date></asp:CompareValidator>
                                <div id="Calendardiv" style="display:none; z-index:2; position:absolute">
                                    <asp:Calendar ID="calEndDate" runat="server" OnSelectionChanged="calStartDate_SelectionChanged" OnDayRender="DayRender" BackColor="#FFFFCC" BorderColor="#FFCC66" BorderWidth="1px" 
                    DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt" ForeColor="#0000C0" Height="100px" 
                    ShowGridLines="True" Width="150px">
                                        <WeekendDayStyle BackColor="#fafad2" ForeColor="#ff0000" />
                                        <SelectedDayStyle BackColor="#00ff00" />                                                           
                                        <TodayDayStyle BackColor="#FFCC66" ForeColor="White" />
                                        <SelectorStyle BackColor="#FFCC66" />
                                        <OtherMonthDayStyle ForeColor="#CC9966" />
                                        <NextPrevStyle Font-Size="9pt" ForeColor="#FFFFCC" />
                                        <DayHeaderStyle BackColor="#FFCC66" Font-Bold="True" Height="1px" />
                                        <TitleStyle BackColor="#990000" Font-Bold="True" Font-Size="9pt" ForeColor="#FFFFCC" />
                                    </asp:Calendar>
                                    </div>                If Not IsPostBack Then
                    SearchEDate.Attributes.Add("onfocus", "javascript:document.getElementById('Calendardiv').style.display = ''")
                    SearchEDate.Attributes.Add("onblur", "javascript:document.getElementById('Calendardiv').style.display = 'none'")
                    end if        Protected Sub calEndDate_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles calEndDate.SelectionChanged
            SearchEDate.Text = calEndDate.SelectedDate
            calEndDate.Attributes.Add("Selected", "javascript:document.getElementById('Calendardiv').style.display = 'none'")        End Sub

Answer 1

我的问题是点击textbox获取焦点后 日历弹出来了 但是选择日历的时候，textbox不就是去焦点了嘛。所以日历也隐藏掉了。那么我日历的选择就触发不了 后台的事件了。我懂这个原因 但是我不知道如何去处理。

Answer 2

这两个函数要修改一下。var bShowCalendar = false;onfoucs函数中bShowCalendar   =true;onblur中if(!bShowCalendar)
{
     //隐藏。
}提交后bShowCalendar 又会变成false

Answer 3

建议lz
日历控件的隐藏不要写在textbox失去焦点的事件里，感觉如果这样写，逻辑有矛盾了。
你可以在日期空间中写事件：选择日期后日期控件自动隐藏。

Answer 4

我在事件里面写了 选择日期后日期控件自动隐藏 的。但是我想如果说我textbox获得焦点后突然又不想先选日期按其他按钮了这样日期也隐藏嘛。

Answer 5

不是很懂你的意思？你onblur里面如果日历没显示就显示，显示了就隐藏？

Answer 6

新发现一个问题。当我点击月份跳转的时候 日历visible看 不见了，要再focus在文本框上日历才出现，这是因为我日历的div是visible=false的当我focus在文本框；里面才显示，但是我转月份的时候 不想他 消失啊，这应该怎么做？各位高人们快帮帮我吧。谢谢

Answer 7

你页面加载的时候就把日历控件隐藏。
你在textbox旁边放一个按钮，当点击那个按钮时就把日历控件显示，
再在日历控件里面写个选中事件，
TextBox8.Text = Calendar1.SelectedDate.ToShortDateString();
 Calendar1.Visible = false;
选择完后把他的值付给textbox，再把他隐藏，这样就可以了

Answer 8

不是 不是这样的意思啦。如果这样做我又何必要做日历的显隐呢。我的意思就是textbox onfocus的时候显示日历。失去焦点的时候隐藏日历。但是我又要显示日历的时候日历可选。也就是说我选择日历的时候textbox还是onfocus的，不想日历隐藏掉。但我选择完的时候他才隐藏。但是问题是我选择日期的时候textbox就失去焦点了。那我就选择不了日历了啊逻辑貌似有问题 但是应该如何解决呢？还有个问题就是我按月份跳转的时候 页面是postback的。这样我日历又隐藏掉了。我日历本来是放在一个DIV里面的，这个DIV是隐藏的。但是我月份跳转的时候不想它提交到服务端啊。这应该怎么解决呢？麻烦各位帮我看看吧。谢谢

Answer 9

第一个问题，你可以这样做，textbox和日历控件其中随便那一个获得焦点的时候就显示日历控件，只有两个都失去焦点的时候才影藏。第二个问题，postback的时候回重新加载页面，这里你可以使用ajax来异步回发，同样可以和服务端交换数据，但是不会刷新页面。

Answer 10

我是用VB.net来做的
他没有getfocus focused的属性啊，这该如何判断啊？而且就一个focus的属性就为控件设定focus。一个问题就算了，第二个问题的解决方法可以详细点吗？我AJAX异步回发怎么做呢？

Answer 11

第一点，我的说的失去焦点和获取焦点事件（Client事件）都可以写在html代码中，与用vb.net还是asp.net没有关系吧。第二点，不明白lz的意思是什么，是不会ajax还是没有思路？感觉这个只需要用到ajax的基本的东西就能实现了，如果对ajax不熟悉，lz可以上网翻一翻，学习下吧。

Answer 12

例如
第一个问题：<asp:TextBox ID="SearchEDate" runat="server" CssClass="TextInput" onfocus="document.getElementById('divDate').style.display=block;" onblur="document.getElementById('divDate').style.display=none;" ></asp:TextBox>其中onfocus为获取焦点的client事件
onblur为失去焦点的client事件

Answer 13

我楼上代码有点小问题，马虎了，不好意思，改成如下<asp:TextBox ID="SearchEDate" runat="server" CssClass="TextInput" onfocus="document.getElementById('divDate').style.display='block';" onblur="document.getElementById('divDate').style.display='none';" ></asp:TextBox>
'block'与'none'的属性不能省略