This is a migrated thread and some comments may be shown as answers.

RadDateTimePicker ,select seperate hours and time

3 Answers 121 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Greg
Top achievements
Rank 1
Greg asked on 24 Sep 2009, 03:05 PM
Hi

Is it possible for the RadDateTimePicker to display and select the hours and minutes seperately? For example a drop down with hours and a drop down with minutes? As I am currently using your controls and we need to be able to select by the minute, but if i did it using your control it would just give me too many options to select from.I thought it would be worth asking rather than having to remove your control and doing it using code.

Thanks

3 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 28 Sep 2009, 11:48 AM
Hi Greg,

I am afraid that such a functionality is not supported out-of-the-box.

A workaround exists, but it is by no means ellegant. Here it is:


<%@ Page Language="C#" %> 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<script runat="server"
 
    protected void Page_Load(object sender, EventArgs e) 
    { 
        RadDateTimePicker1.TimeView.DataList.DataSource = new DateTime[1]; 
        RadDateTimePicker1.TimeView.DataList.DataBind(); 
    } 
     
</script> 
 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"
<meta http-equiv="content-type" content="text/html;charset=utf-8" /> 
<title>RadControls for ASP.NET AJAX</title> 
<style type="text/css"
 
.RadCalendarTimeView td 
    border:0 !important; 
 
</style> 
</head> 
<body> 
<form id="form1" runat="server"
<asp:ScriptManager ID="ScriptManager1" runat="server" /> 
 
<telerik:RadDateTimePicker ID="RadDateTimePicker1" runat="server"
    <TimeView runat="server"
        <TimeTemplate> 
            HH: <asp:DropDownList ID="HoursDropDownList" runat="server"
                <asp:ListItem Text="1" /> 
                <asp:ListItem Text="2" /> 
                <asp:ListItem Text="3" /> 
            </asp:DropDownList> 
             
            &nbsp;&nbsp;&nbsp; 
             
            mm: <asp:DropDownList ID="MinutesDropDownList" runat="server"
                <asp:ListItem Text="1" /> 
                <asp:ListItem Text="2" /> 
                <asp:ListItem Text="3" /> 
            </asp:DropDownList> 
             
            <br /><br /> 
             
            <asp:Button ID="Button1" runat="server" OnClientClick="return ApplyTime()" Text="Apply Time" /> 
        </TimeTemplate> 
    </TimeView> 
</telerik:RadDateTimePicker> 
 
<script type="text/javascript"
 
Sys.Application.add_load(clearClickHandler); 
 
function clearClickHandler() 
    var tv = $find("<%= RadDateTimePicker1.ClientID %>").get_timeView(); 
     
    if (tv._onCellMouseOutDelegate) 
    { 
        $removeHandler(tv.DivElement, "mouseout", tv._onCellMouseOutDelegate); 
        tv._onCellMouseOutDelegate = null
    } 
     
    if (tv._onCellMouseOverDelegate) 
    { 
        $removeHandler(tv.DivElement, "mouseover", tv._onCellMouseOverDelegate); 
        tv._onCellMouseOverDelegate = null
    } 
     
    if (tv._onCellClickDelegate) 
    { 
        $removeHandler(tv.DivElement, "click", tv._onCellClickDelegate); 
        tv._onCellClickDelegate = null
    } 
 
function ApplyTime() 
    var picker = $find("<%= RadDateTimePicker1.ClientID %>"); 
    picker.hideTimePopup(); 
     
    var pd = picker.get_selectedDate(); 
     
    if (!pd) 
    { 
        pd = new Date(); 
    } 
     
    pd.setHours(parseInt($get("<%= RadDateTimePicker1.ClientID %>_timeView_tdl_ctl01_HoursDropDownList").value)); 
    pd.setMinutes(parseInt($get("<%= RadDateTimePicker1.ClientID %>_timeView_tdl_ctl01_MinutesDropDownList").value)); 
     
    picker.set_selectedDate(pd); 
     
    return false; 
 
</script> 
 
</form> 
</body> 
</html> 


Sincerely yours,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
bad nick
Top achievements
Rank 1
answered on 09 Oct 2009, 01:29 PM
This is great!

Can the time in TimeView  be pre-selected to dynamic values from code-behind? It's SelectedItem/Value properties seemed to be read-only and setting TimeView.StartTime also doesn't work for these.
0
Dimo
Telerik team
answered on 09 Oct 2009, 03:33 PM
Hi Ruslan,

You can use the SelectedDate property of the date/time picker to preselect a value. The TimeView itself does not have such a property, as the TimeView cannot not exist as a separate control - it always "serves" a picker.

All the best,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Tags
Calendar
Asked by
Greg
Top achievements
Rank 1
Answers by
Dimo
Telerik team
bad nick
Top achievements
Rank 1
Share this question
or