RadTimepicker - dynamically setting maxdate, endtime and interval gives invalid time error on selecting time

4 posts, 0 answers
  1. Dev
    Dev avatar
    28 posts
    Member since:
    Jan 2011

    Posted 31 Jul 2013 Link to this post

    Hello,

    I am using ASP.NET 3.5 with C#, telerik version 2012.1.515.35.

    I have a RadTimepicker inside an UserControl.

    I want to restrict entering of future time. Suppose I have 7:00 AM on my computer then user can select / insert maximum time 7:00 am, not more than that.

    I also I need to show the RadTimepicker's time as per logged-in user's timezone. For that I am taking DateTime.UTCNow and converting it to user's time with some extension method.

    The ascx page's RadTimepicker control's configuration is :

    <telerik:RadTimePicker ID="rtpVitals" runat="server" Width="85" DateInput-DateFormat="HH:mm"
        TimeView-TimeFormat="HH:mm" Skin="Hay">
        <Calendar UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x">
        </Calendar>
        <TimeView CellSpacing="-1" TimeFormat="HH:mm" OnClientTimeSelected="OnClientTimeSelected">
        </TimeView>
        <TimePopupButton CssClass="" ImageUrl="" HoverImageUrl="" onblur="hideTimePopup('rtpVitals');">
        </TimePopupButton>
        <DatePopupButton Visible="False" CssClass="" ImageUrl="" HoverImageUrl=""></DatePopupButton>
        <DateInput CssClass="txtbox txtBack-Color" BorderColor="#D0D1AE" BorderStyle="Solid"
            BorderWidth="1" ForeColor="#333333" onblur="enterDateTime();">
        </DateInput>
    </telerik:RadTimePicker>


    And in Page_PreRender() event of UserControl i call following method to set the RadTimePicker's property :

    private void setTimePicker()
    {
        try
        {
            TimeZoneInfo t = TimeZoneInfo.FindSystemTimeZoneById("Central Standard Time");
            DateTime d = DateTime.UtcNow.ToUserTime(t);
     
            rtpVitals.TimeView.StartTime = new TimeSpan(0, 0, 0);
     
            if (d.Hour < 1)
            {
                rtpVitals.TimeView.Interval = new TimeSpan(0, d.Minute/2, 0);
     
                if (d.Minute <= 1)
                {
                    rtpVitals.TimeView.Interval = new TimeSpan(0, 0, d.Second/2);
                }
            }
            else if (d.Hour < 12)
            {
                rtpVitals.TimeView.Interval = new TimeSpan(0, 30, 0);
            }
            else
            {
                rtpVitals.TimeView.Interval = new TimeSpan(1, 00, 0);
            }
     
            rtpVitals.TimeView.EndTime = new TimeSpan(d.Hour, d.Minute, d.Second);
        }
        catch (Exception ex)
        {
            throw ex;
        }
    }


    The extension method to convert time is as below :

    public static DateTime ToUserTime(this DateTime utcTime, TimeZoneInfo toUserTimeZone)
    {
        try
        {
            utcTime = DateTime.SpecifyKind(utcTime, DateTimeKind.Unspecified);
            //Create the userTime object
            //Set it to UTC time by default. It would be changed later
            DateTime userTime = utcTime;
     
            //Convert the time
            TimeZoneInfo fromTimeZone = TimeZoneInfo.Utc;
            userTime = TimeZoneInfo.ConvertTime(utcTime, fromTimeZone, toUserTimeZone);
     
            //Return the TimeZone
            return userTime;
        }
        catch
        {
            throw;
        }
    }


    FYI : My computer's timezone is "(UTC+5:30) Chennai, Kolkata, Mumbai, New Delhi".

    Set your PC's time between 8:30 AM to 10:30 AM, and run the project. The time-view will show you time upto 23:00 hours with 1 hour interval, but selection of any time will give you the error icon i.e. invalid time inside RadTimePicker.

    You have any idea why it is happening?

    Thanks..







  2. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 05 Aug 2013 Link to this post

    Hi Devendra,

    The picker works independently from the time zone, but you could assume it works with the server time in both server and client.

    For example if you select 8:30 AM (UTC+5:30) server side, regardless of the user's location, he will see "8:30 AM" in the browser. And if he choose "9:30 AM", then on server you will get 9:30 AM (UTC+5:30)

    If you want to limit the user to enter value according to his time zone, you should only change the Min and MaxDate and then add/subtract hours when accessing the SelectedDate property.

    Regards,
    Vasil
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Dev
    Dev avatar
    28 posts
    Member since:
    Jan 2011

    Posted 06 Aug 2013 Link to this post


    Hello Vasil,

    As you said, I have updated my method to set RadTimepicker's time as below :

    private void setTimePicker()
    {
        try
        {
            TimeZoneInfo t = TimeZoneInfo.FindSystemTimeZoneById("Central Standard Time");
            DateTime d = DateTime.UtcNow.ToUserTime(t);
            rtpVitals.MinDate = DateTime.UtcNow.Subtract(new TimeSpan(1, 0, 0, 0)).ToUserTime(t);
            rtpVitals.MaxDate = d;
        }
        catch (Exception ex)
        {
            throw ex;
        }
    }


    But now, it is showing all 23:00 hours in timeview and also accepting the future time.

    If user's time is 11:00 AM then the RadTimePicker's behavior should be something like show warning icon if someone selects 12:00 PM. But in your case this restriction is not working.

    Could you please paste any sample code or provide me a sample project?

    By the way, thanks for your valuable reply.
  5. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 09 Aug 2013 Link to this post

    Hi Devendra,

    You can use such approach:

    Setting min and max date with some offset:
    protected void Page_Load(object sender, EventArgs e)
      {
          RadTimePicker1.MinDate = originalMinDate.AddHours(offsetHours);
          RadTimePicker1.MinDate = originalMaxDate.AddHours(offsetHours);
      }

    Getting the selected time:

    protected void RadTimePicker1_SelectedDateChanged(object sender, SelectedDateChangedEventArgs e)
    {
        DateTime selectedCorrectedDate = RadTimePicker1.SelectedDate.Value.AddHours(-offsetHours);
    }

    In the example above, the picker works with offset server time, and actually don't matter what is the client time.

    Regards,
    Vasil
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top