locked
hide calendar depend on ASP:TEXTBOX RRS feed

  • Question

  • User1741069310 posted

    HI

    I finding a way to hide ASP:calendar in case of mouseout ASP:TEXTBOX

    visible ASP:calendar in case of mouseover ASP:TEXTBOX

    <asp:TableCell>From&nbsp;:<asp:TextBox runat="server" ID="LastUpdateDateTimeFrom" Format="yyyy-MM-dd" AutoPostback="True" TextChanged="LastUpdateDateTimeFrom_TextChanged" /><br />
    <asp:Calendar id="LastUpdateDateTimeLastUpdateDateTimeFromCal" runat="server" FirstDayOfWeek="Sunday" Enabled="True" Format="yyyy-MM-dd" OnSelectionChanged="DateFrom_Selection_Change"></asp:Calendar>
    </asp:TableCell>

    Thanks

    Francis SZE

    Monday, November 5, 2018 1:15 AM

All replies

  • User61956409 posted

    Hi Francis SZE,

    finding a way to hide ASP:calendar in case of mouseout ASP:TEXTBOX

    visible ASP:calendar in case of mouseover ASP:TEXTBOX

    You can refer to the following code snippets to hide asp:Calendar control.

    From&nbsp;:<asp:TextBox runat="server" ID="LastUpdateDateTimeFrom" Format="yyyy-MM-dd" AutoPostBack="True" OnTextChanged="LastUpdateDateTimeFrom_TextChanged" onmouseout="myfunc()" /><br />
    <script>
        function myfunc() {
            var fromdate = document.getElementById('<%=LastUpdateDateTimeFrom.ClientID%>').value;
    
            //your code logic here
            if (fromdate != "") {
                document.getElementById('<%=LastUpdateDateTimeLastUpdateDateTimeFromCal.ClientID%>').style.visibility = "hidden";
            }
        }
    </script>

    Test Result:

    Note:

    When the loses focus from asp:TextBox "LastUpdateDateTimeFrom", which will cause page postback, and the asp:Calendar control would be displayed again. If possible, you can hide the asp:Calendar control within LastUpdateDateTimeFrom_TextChanged event.

    With Regards,

    Fei Han

    Tuesday, November 6, 2018 2:13 AM