How to Set Relative Dates (e.g. "3 days ago") to RadDatePicker or RadDateInput

Thread is closed for posting
1 posts, 1 answers
  1. Answer
    63F75A2C-1F16-4AED-AFE8-B1BBD57646AD
    63F75A2C-1F16-4AED-AFE8-B1BBD57646AD avatar
    1572 posts
    Member since:
    Oct 2004

    Posted 31 Aug 2009 Link to this post

    Requirements
    RadControls for ASP .NET AJAX version 2008.1.415 and later
    .NET version 2.0 and later
     
    Visual Studio version 2005 and later
    Programming language Javascript
    Browser support

    all browsers supported by RadControls for ASP .NET AJAX


    PROJECT DESCRIPTION

    In some cases, it may be more convenient and faster to specify a "relative" date, instead of choosing one from a RadDatePicker or typing a valid date string manually. For example if today is August 31 and you type "-3" or "+5" in the DateInput textbox, you may want the control to treat this as "three days ago" or "after five days", i.e. August 28 or September 5. Here is how to do this:

    Markup

    RadDatePicker: 
    <telerik:RadDatePicker ID="RadDatePicker1" runat="server"> 
        <DateInput ClientEvents-OnValueChanging="MyValueChanging" /> 
    </telerik:RadDatePicker> 
     
    <br /><br /> 
     
    RadDateInput: 
    <telerik:RadDateInput ID="RadDateInput1" runat="server"> 
        <ClientEvents OnValueChanging="MyValueChanging" /> 
    </telerik:RadDateInput> 


    Javascript

    // global variable used in the function below  
    var DateInputRelativeDateFlag = false; 
     
    function MyValueChanging(sender, args) 
    { 
        var textBoxValue = args.get_newValue(); 
        var daysInt = parseInt(textBoxValue); 
        if (!DateInputRelativeDateFlag && (daysInt < 0 || textBoxValue.indexOf("+") != -1)) 
        { 
            args.set_cancel(true); 
            var newDate = new Date(); 
            newDate.setDate(newDate.getDate() + daysInt); 
            DateInputRelativeDateFlag = true; 
            sender.set_selectedDate(newDate); 
            DateInputRelativeDateFlag = false; 
        } 
    } 


    The IF statement can be modified in order to suit any particular scenario.
Back to Top

This Code Library is part of the product documentation and subject to the respective product license agreement.