'End Date' to change when 'Start Date' changes

[Anthony]

I have followed the example on how to change the End Date when the Start Date changes and it works great.

However, when the Start Time is changed, I would like to achieve the following:

• I need the End Time to change, but I'd like it to change by a pre-defined amount of time (e.g. 1 hour 30 mins, from a TimeSpan in the code behind) added on to the Start Time. How can I do this?

Regards,
Anthony

[Anthony]

Getting the times to change was as simple as copying the example, but changing RadDatePicker to RadTimePicker and replacing "StartDate" and "EndDate" for "StartTime" and "EndTime" in the javascript code.

Now it is just a case of getting the EndTime to change to the StartTime plus the duration of the appointment.

Javascript is certainly not my forte, so if anyone can help me convert a string: "01:45:00" (hh:mm:ss) into a format that may be added to the start time such as below:

var duration = "01:45:00";

// convert the string to a date/duration

endDatePicker.set_selectedDate(sender.get_selectedDate() + duration);

... that would be great.

Thanks

[Veronica]

Hi Anthony,

Yes, the help topic is a part of the solution. Here's the javascript code to add the duration:

function changeEndTime(sender, e) {
                var endTimePickerID = sender.get_id().replace("StartTime", "EndTime");
                var endTimePicker = $find(endTimePickerID);
                var duration = "01:45:00";
                var durationArray = duration.split(":", 2);
                var hours = durationArray[0];
                var minutes = durationArray[1];
                var totalDurationMinutes = hours * 60 + minutes;
                endTimePicker.set_selectedDate(new Date(sender.get_selectedDate().setMinutes(sender.get_selectedDate().getMinutes() + totalDurationMinutes)));
            }

I've split the duration to get the hours and minutes separately. Then I converted all the duration to minutes (by multiplicating hours by 60) and finally added the totalDurationMinutes to the sender.SelectedDate().

Hope this helps.

Best wishes,
Veronica Milcheva
the Telerik team

[Anthony]

Thanks for your response.

It might be worth noting that in my application, 'totalDurationMinutes' was concatenating two strings instead of adding two ints, i.e. totalDurationMinutes = 60 + 45 = 6045.

Therefore, use parseInt() on the variables and you get the correct number of minutes: 105.

function changeEndTime(sender, e) {
        var endTimePickerID = sender.get_id().replace("StartTime", "EndTime");
        var endTimePicker = $find(endTimePickerID);
        var duration = "01:45:00";
        var durationArray = duration.split(":", 2);
        var hours = parseInt(durationArray[0]);
        var minutes = parseInt(durationArray[1]);
        var totalDurationMinutes = ((hours * 60) + minutes);
        endTimePicker.set_selectedDate(new Date(sender.get_selectedDate().setMinutes(sender.get_selectedDate().getMinutes() + totalDurationMinutes)));
    }

[Veronica]

Hello Anthony,

Actually my code was working without the need of the parseInt() function. However I'm glad you've found the solution.

Please note that parseInt("09") is dangerous as "09" can be considered as a number in octal numeral system. For safe conversion use parseInt("09", 10).
 
Greetings,
Veronica Milcheva
the Telerik team