DayPilot » Knowledge Base » How to show the selected date using a Label control

It is possible to show the visible date using a special Label control.

The HTML code looks like this:

<h2><asp:Label ID="LabelMonth" runat="server">August 2010</asp:Label></h2>

Updating the value using PostBack

Updating the value using PostBack is easy, just call something like this:

LabelMonth.Text = DayPilotMonth1.StartDate.ToString("MMMM yyyy");

Updating the value using CallBack

During CallBack, it's not possible to update other controls using a server-side code.

If you want to update the LabelMonth value, you have to use AfterRenderJavaScript handler to update it on the client side using JavaScript.

AfterRenderJavaScript="afterRender(data)"

You could read the date from the startDate property of the main control (Calendar, Scheduler, Month). However, JavaScript doesn't provide good tools to format the Date output. It's better to send the preformatted string using Update() method. It's enough to send it only when the StartDate actually changes (such as on "navigate" command send from DayPilot Navigator).

    protected void DayPilotMonth1_Command(object sender, CommandEventArgs e)
    {

        switch (e.Command)
        {
            case "navigate":
                DayPilotMonth1.StartDate = (DateTime)e.Data["start"];
                DayPilotMonth1.DataSource = getData(DayPilotMonth1.VisibleStart, DayPilotMonth1.VisibleEnd, (string)DayPilotMonth1.ClientState["filter"]);
                DayPilotMonth1.DataBind();

                Hashtable data = new Hashtable();
                data["label"] = DayPilotMonth1.StartDate.ToString("MMMM yyyy");
                DayPilotMonth1.Update(data, CallBackUpdateType.Full);                break;
        }
    }

The afterRender method updates the label using JavaScript:

function afterRender(data) {
  // check if the label should be updated
  if (data && data.label) {
    var label = document.getElementById("LabelMonth");
    label.innerHTML = data.label;
  }
}