Showing posts with label Calendar. Show all posts
Showing posts with label Calendar. Show all posts

Friday, 28 September 2012

You can set holidays or note on particular date in calendar control. For that we are using "DayRender" Event of the calendar control. This event call on each day cell render, so we can check particular date make set tool tips and also set our user defined backcolor or apply any style in that particular day cell.
You can see tool tip on mouse over of that particular day.

Here is example for this.
In this example we display holidays and notes with two different colors.

ASPX Code :
        <asp:Calendar ID="Calendar1" runat="server"  BackColor="#FFFFCC" 
            BorderColor="#FFCC66" DayNameFormat="Shortest" Font-Names="Verdana" 
            Font-Size="8pt" ForeColor="#663399" Height="200px" Width="220px" 
            BorderWidth="1px" ShowGridLines="True" OnDayRender="Calendar1_DayRender" SelectionMode="None" >
            <DayHeaderStyle BackColor="#FFCC66" Font-Bold="True" Height="1px" />
            <NextPrevStyle Font-Size="9pt" ForeColor="#FFFFCC" />
            <OtherMonthDayStyle ForeColor="#CC9966" />
            <SelectedDayStyle BackColor="#CCCCFF" Font-Bold="True" />
            <SelectorStyle BackColor="#FFCC66" />
            <TitleStyle BackColor="#990000" Font-Bold="True" Font-Size="9pt" 
                ForeColor="#FFFFCC" />
            <TodayDayStyle BackColor="#FFCC66" ForeColor="White" />
        </asp:Calendar>

C# Examples :
    protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
    {

        switch(e.Day.Date.ToString("dd/MM/yyyy"))
        {
            case "01/09/2012":
                e.Cell.ToolTip = "Holiday 1";
                e.Cell.BackColor = System.Drawing.Color.Red;
                break;
            case "05/09/2012":
                e.Cell.ToolTip = "Holiday 2";
                e.Cell.BackColor = System.Drawing.Color.Red;
                break;
            case "20/09/2012":
                e.Cell.ToolTip = "Note : Meeting with client";
                e.Cell.BackColor = System.Drawing.Color.Yellow;
                break;

        }

    }

VB.net Examples :
    Protected Sub Calendar1_DayRender(ByVal sender As Object, ByVal e As DayRenderEventArgs)

        Select Case e.Day.Date.ToString("dd/MM/yyyy")
            Case "01/09/2012"
                e.Cell.ToolTip = "Holiday 1"
                e.Cell.BackColor = System.Drawing.Color.Red
                Exit Sub
            Case "05/09/2012"
                e.Cell.ToolTip = "Holiday 2"
                e.Cell.BackColor = System.Drawing.Color.Red
                Exit Sub
            Case "20/09/2012"
                e.Cell.ToolTip = "Note : Meeting with client"
                e.Cell.BackColor = System.Drawing.Color.Yellow
                Exit Sub

        End Select

    End Sub

Output :
Set Holidays or Note on particular date in asp calendar control

Note : Give Us your valuable feedback in comments. Give your suggestions in this article so we can update our articles accordingly that.



Wednesday, 26 September 2012

Click Here to Download SelectWeekInCalendarControl.zip

You can select entire week or month in asp.net calendar control and get it's selected dates.
You can achieve using SelectionMode property of calendar control.
Selection mode property has an enum and it has four selection mode like Day , DayWeek , DayWeekMonth and None.

Here is example for this.
In this example we take calendar control and we set selection mode as DayWeek. When we set this mode after that calender control automatically add one column for select particular week.
You can specify "DayWeekMonth" value to selection mode property for select entire month and also specify "SelectMonthText" property to display select text.

ASPX Code :
        <asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="Black" 
            Font-Names="Times New Roman" Font-Size="10pt" ForeColor="Black" Height="220px"
                NextPrevFormat="FullMonth" Width="400px" SelectionMode="DayWeek" 
            DayNameFormat="Shortest" TitleFormat="Month" SelectWeekText="Select" >
                <DayHeaderStyle Font-Bold="True" Font-Size="7pt" ForeColor="#333333" 
                    Height="10pt" BackColor="#CCCCCC" />
                <DayStyle Width="14%" />
                <NextPrevStyle Font-Size="8pt" ForeColor="White" />
                <OtherMonthDayStyle ForeColor="#999999" />
                <SelectedDayStyle BackColor="#CC3333" ForeColor="White" />
                <SelectorStyle BackColor="#CCCCCC" Font-Bold="True" Font-Names="Verdana" 
                    Font-Size="8pt" ForeColor="#333333" Width="1%" />
                <TitleStyle BackColor="Black" Font-Bold="True"
                    Font-Size="13pt" ForeColor="White" Height="14pt" />
                <TodayDayStyle BackColor="#CCCC99" />
        </asp:Calendar>
         <br />

         <asp:Button runat="server" ID="btnGetSelectedDate" Text="Get Selected Date" 
        /> &nbsp;&nbsp;&nbsp;
         <b>Date : </b><asp:Label runat="server" ID="lblDate" ></asp:Label>

C# Examples :
    protected void btnGetSelectedDate_Click(object sender, EventArgs e)
    {
        foreach (DateTime dt in Calendar1.SelectedDates)
        {
            lblDate.Text = lblDate.Text + " <br/> " + dt.ToString("dd/MM/yyyy");
        }
    }

VB.net Examples :
    Protected Sub btnGetSelectedDate_Click(ByVal sender As Object, ByVal e As EventArgs)
        For Each dt As DateTime In Calendar1.SelectedDates
            lblDate.Text = lblDate.Text + " <br/> " & dt.ToString("dd/MM/yyyy")
        Next
    End Sub

Output :



 For Beginning .Net articles. Click Here...

Note : Give Us your valuable feedback in comments. Give your suggestions in this article so we can update our articles accordingly that.



 

Saturday, 22 September 2012

Click Here to Download Sample MultipleDateSelectionInCalendarControl.zip

You can select multiple dates in calendar control.
There is a no direct way to select multiple dates in calendar control. You need to write some code for that.

Here is example for this.
In this example we take one calendar control and select multiple dates in that control and we display that selected dates in label.

ASPX Code : 
      <asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="Black" 
            Font-Names="Verdana" Font-Size="9pt" ForeColor="Black" Height="250px"
                NextPrevFormat="ShortMonth" OnPreRender="Calendar1_PreRender" Width="330px" 
                OnSelectionChanged="Calendar1_SelectionChanged" BorderStyle="Solid" 
            CellSpacing="1">
                <DayHeaderStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" 
                    Height="8pt" />
                <DayStyle BackColor="#CCCCCC" />
                <NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="White" />
                <OtherMonthDayStyle ForeColor="#999999" />
                <SelectedDayStyle BackColor="#333399" ForeColor="White" />
                <TitleStyle BackColor="#333399" Font-Bold="True"
                    Font-Size="12pt" ForeColor="White" BorderStyle="Solid" Height="12pt" />
                <TodayDayStyle BackColor="#999999" ForeColor="White" />
        </asp:Calendar>

         <br />
         <br />
         <asp:Button runat="server" ID="btnGetSelectedDate" Text="Get Selected Date" 
            onclick="btnGetSelectedDate_Click" /> &nbsp;&nbsp;&nbsp;<br />
         <b>Selected Dates : </b><asp:Label runat="server" ID="lblDate" ></asp:Label>


C# Examples :
    protected void Calendar1_PreRender(object sender, EventArgs e)
    {
        
        Calendar1.SelectedDates.Clear();

        foreach (DateTime dt in MultipleSelectedDates)
        {
            Calendar1.SelectedDates.Add(dt);
        }
    }
    protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {

        if (MultipleSelectedDates.Contains(Calendar1.SelectedDate))
        {
            MultipleSelectedDates.Remove(Calendar1.SelectedDate);
        }
        else
        {
            MultipleSelectedDates.Add(Calendar1.SelectedDate);
        }
        
        ViewState["MultipleSelectedDates"] = MultipleSelectedDates;
    }
   

    public List<DateTime> MultipleSelectedDates
    {
        get
        {
            if (ViewState["MultipleSelectedDates"] == null)

                ViewState["MultipleSelectedDates"] = new List<DateTime>() ;
            return (List<DateTime>)ViewState["MultipleSelectedDates"];
        }
        set
        {
            ViewState["MultipleSelectedDates"] = value;
        }
    }


    protected void btnGetSelectedDate_Click(object sender, EventArgs e)
    {

        foreach (DateTime dt in MultipleSelectedDates)
        {
            lblDate.Text = lblDate.Text + " <br/> " + dt.ToString("dd/MM/yyyy");
        }
    }

VB.net Examples :
    Protected Sub Calendar1_PreRender(ByVal sender As Object, ByVal e As EventArgs)

        Calendar1.SelectedDates.Clear()

        For Each dt As DateTime In MultipleSelectedDates
            Calendar1.SelectedDates.Add(dt)
        Next
    End Sub
    Protected Sub Calendar1_SelectionChanged(ByVal sender As Object, ByVal e As EventArgs)

        If MultipleSelectedDates.Contains(Calendar1.SelectedDate) Then
            MultipleSelectedDates.Remove(Calendar1.SelectedDate)
        Else
            MultipleSelectedDates.Add(Calendar1.SelectedDate)
        End If

        ViewState("MultipleSelectedDates") = MultipleSelectedDates
    End Sub


    Public Property MultipleSelectedDates() As List(Of DateTime)
        Get
            If ViewState("MultipleSelectedDates") Is Nothing Then

                ViewState("MultipleSelectedDates") = New List(Of DateTime)()
            End If
            Return DirectCast(ViewState("MultipleSelectedDates"), List(Of DateTime))
        End Get
        Set(ByVal value As List(Of DateTime))
            ViewState("MultipleSelectedDates") = value
        End Set
    End Property

    Protected Sub btnGetSelectedDate_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnGetSelectedDate.Click
        For Each dt As DateTime In MultipleSelectedDates
            lblDate.Text = lblDate.Text + " <br/> " & dt.ToString("dd/MM/yyyy")
        Next
    End Sub

Output : 


Note : Give Us your valuable feedback in comments. Give your suggestions in this article so we can update our articles accordingly that.


Wednesday, 19 September 2012

You can get the selected date from calendar control.
There is a "SelectedDate" property of calendar control. This property is get and set property so you can also set date of calendar control. Calender control provided in asp.net.

Here is example for this.
In this example we take calendar control , button and label. First you select date in control. By Default today date is highlighted but not selected. When you select date at that time date background color will changed after that On click of button we retrieve selected date from calendar control and display in label.
We can also format the date and display in our specific date format. in this example we display date in "dd/MM/yyyy" format.

ASPX Code :
        <asp:Calendar ID="Calendar1" runat="server" BackColor="#FFFFCC" 
            BorderColor="#FFCC66" DayNameFormat="Shortest" Font-Names="Verdana" 
            Font-Size="8pt" ForeColor="#663399" Height="200px" Width="220px" 
            BorderWidth="1px" ShowGridLines="True">
            <DayHeaderStyle BackColor="#FFCC66" Font-Bold="True" Height="1px" />
            <NextPrevStyle Font-Size="9pt" ForeColor="#FFFFCC" />
            <OtherMonthDayStyle ForeColor="#CC9966" />
            <SelectedDayStyle BackColor="#CCCCFF" Font-Bold="True" />
            <SelectorStyle BackColor="#FFCC66" />
            <TitleStyle BackColor="#990000" Font-Bold="True" Font-Size="9pt" 
                ForeColor="#FFFFCC" />
            <TodayDayStyle BackColor="#FFCC66" ForeColor="White" />
        </asp:Calendar>

         <br />

         <asp:Button runat="server" ID="btnGetSelectedDate" Text="Get Selected Date" 
            onclick="btnGetSelectedDate_Click" /> &nbsp;&nbsp;&nbsp;
         <b>Date : </b><asp:Label runat="server" ID="lblDate" ></asp:Label>

C# Examples :
    protected void btnGetSelectedDate_Click(object sender, EventArgs e)
    {
        lblDate.Text = Calendar1.SelectedDate.Date.ToString("dd/MM/yyyy");
    }

VB.net Examples :
    Protected Sub btnGetSelectedDate_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnGetSelectedDate.Click
        lblDate.Text = Calendar1.SelectedDate.Date.ToString("dd/MM/yyyy")
    End Sub

Output : 


For Beginning .Net articles. Click Here...

This type of .Net Tips is very useful in day to day programming life.

Note : Give Us your valuable feedback in comments. Give your suggestions in this article so we can update our articles accordingly that.




Calendar control is available in asp.net.
You can set "asp:Calendar" control on page and set it's various properties.

Here is example for this.
In this example we put calendar control and set it's properties.

ASPX Code :
        <asp:Calendar ID="Calendar1" runat="server" BackColor="White" 
            BorderColor="Black" DayNameFormat="Shortest" Font-Names="Times New Roman" 
            Font-Size="10pt" ForeColor="Black" Height="220px" NextPrevFormat="FullMonth" 
            TitleFormat="Month" Width="400px">
            <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" 
                ForeColor="#333333" Height="10pt" />
            <DayStyle Width="14%" />
            <NextPrevStyle Font-Size="8pt" ForeColor="White" />
            <OtherMonthDayStyle ForeColor="#999999" />
            <SelectedDayStyle BackColor="#CC3333" ForeColor="White" />
            <SelectorStyle BackColor="#CCCCCC" Font-Bold="True" Font-Names="Verdana" 
                Font-Size="8pt" ForeColor="#333333" Width="1%" />
            <TitleStyle BackColor="Black" Font-Bold="True" Font-Size="13pt" 
                ForeColor="White" Height="14pt" />
            <TodayDayStyle BackColor="#CCCC99" />
        </asp:Calendar>

Output :

For Beginning .Net articles. Click Here...

This type of .Net Tips is very useful in day to day programming life.

Note : Give Us your valuable feedback in comments. Give your suggestions in this article so we can update our articles accordingly that.