[Solved] radcalendar

[imtiyaz mohammed]

Hello All

I have a TextBox say Enter Range, when the user click in the test box, i am getting radcalander and giving the choice to select date range, when user select dates i am getting one by one dates in the text box,

But i want only two dates should be selected and display in the text box at a time
can you please solve the problem,i want multiple selection and display which one is min and second is max that is start date  and enddate.

instead of giving two textbox, i am giving user only one textbox with in this he is selecting two dates.
can anyone solve this

regards

immu

[Shinu]

Hello Imtiyaz,

Try out the following approach and see whether it suits your need.

ASPX:

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<telerik:radcalendar id="RadCalendar1" runat="server">
<ClientEvents OnDateSelected="OnDateSelected" OnDateSelecting="OnDateSelecting"/>
</telerik:radcalendar>

C#:

protected void Page_Load(object sender, EventArgs e)
{
    TextBox1.Attributes.Add("onclick", "showCalendar()");
}

JavaScript:

<script type="text/javascript">
function showCalendar()
{
    var calendar = $find("<%= RadCalendar1.ClientID %>");
    calendar.get_element().style.display = 'block';
}
function hideCalendar()
{
    var calendar = $find("<%= RadCalendar1.ClientID %>");
    calendar.get_element().style.display = 'none';
}
function pageLoad()
{
    hideCalendar();
}
function OnDateSelected(sender, args)
{
    var text = document.getElementById('TextBox1');
    var calendar = $find("<%= RadCalendar1.ClientID %>");
    if(calendar.GetSelectedDates().length != 0)
    {
        d1 = new Date();
        d1 = calendar.GetSelectedDates()[0][2] + '/' + calendar.GetSelectedDates()[0][1] + '/' +  calendar.GetSelectedDates()[0][0];
        var temp = d1 + " - ";
        if(calendar.GetSelectedDates().length != '1')
        {
            d2 = new Date();
            d2 = calendar.GetSelectedDates()[1][2] + '/' + calendar.GetSelectedDates()[1][1] + '/' +  calendar.GetSelectedDates()[1][0];
            if(Date.parse(d1) < Date.parse(d2))
            {
                temp = d1 + " - " + d2;
            }
            else
            {
                temp = d2 + " - " + d1;
            }
            calendar.get_element().style.display = 'none';
        }
        text.value = temp;
    }
}
function OnDateSelecting(sender, args)
{
    if(sender.get_selectedDates().length == 2 && !args._renderDay.get_isSelected())
    {
        args.set_cancel(true);
    }
}
</script>

-Shinu.