ASP Net Controls ASP.Net Tutorial

  1. Home
  2. ASP.Net Tutorial
  3. ASP Net Controls
  4. Creating a Pop-up Date Picker
<%@ Page Language="C#" %>
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    protected void calEventDate_SelectionChanged(object sender, EventArgs e)
    {
        txtEventDate.Text = calEventDate.SelectedDate.ToString("d");
    }
    protected void btnSubmit_Click(object sender, EventArgs e)
    {
        lblResult.Text = "You picked: " + txtEventDate.Text;
    }



    
        function displayCalendar()
        {
            var datePicker = document.getElementById('datePicker');
            datePicker.style.display = 'block';
        }
    
    
        #datePicker
        {
            display:none;
            position:absolute;
            border:solid 2px black;
            background-color:white;
        }
        .content
        {
            width:400px;
            background-color:white;
            margin:auto;
            padding:10px;
        }
        html
        {
            background-color:silver;
        }
    
    Calendar with JavaScript


    
    
            id="lblEventDate"
        Text="Event Date:"
        AssociatedControlID="txtEventDate"
        Runat="server" />
            id="txtEventDate"
        Runat="server" />
    
    
            id="calEventDate"
        OnSelectionChanged="calEventDate_SelectionChanged"
        Runat="server" />
    

    
            id="btnSubmit"
        Text="Submit"
        Runat="server" OnClick="btnSubmit_Click" />
    
            id="lblResult"
        Runat="server" />