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

RadDatePicker - User cannot set null / blank date with EnableTyping=false

1 Answer 102 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Mich Meow
Top achievements
Rank 1
Mich Meow asked on 21 Aug 2012, 03:19 PM
We are using RadDatePickers in our application and have a business requirement to force the user pick the date using the popup calendar rather than manually typing it in which is accomplished with the EnableTyping="false" flag. So far so good.

The problem is once a date is picked the end user has no way to blank it out or undo it - i.e. intentionally set the date back to null using the popup calendar. Is there a way to do this? I was playing around with the popup calendar and could not find a way to set it blank from the popup date picker. In the past the user could highlight the date text and delete it but this is disabled due to the EnableTyping="false" flag. Below is a sample of how the picker is used in the applicaiton:
<telerik:RadDatePicker ID="rdpDateTimeField" runat="server" Skin="Office2007" Width="150px" MinDate="1/1/1900" EnableTyping="false" ToolTip="Please select date using the calendar icon.">
          <Calendar ShowRowHeaders="false">
          </Calendar>
</telerik:RadDatePicker>

1 Answer, 1 is accepted

Sort by
0
Kevin
Top achievements
Rank 2
answered on 22 Aug 2012, 01:07 PM
Hello Andrew,

One thing you can do is add a clear button to the Calendar popup. Like so:

<telerik:RadDatePicker ID="rdpDateTimeField" runat="server" Skin="Office2007" Width="150px"
        MinDate="1/1/1900" EnableTyping="false" ToolTip="Please select date using the calendar icon.">
        <Calendar ShowRowHeaders="false">
            <FooterTemplate>
                <telerik:RadButton ID="btnClear" runat="server" Text="Clear" Skin="Office2007" OnClientClicked="OnClientClicked"
                    RegisterWithScriptManager="false">
                </telerik:RadButton>
            </FooterTemplate>
        </Calendar>
    </telerik:RadDatePicker>
  
    <script type="text/javascript">
        function OnClientClicked(sender, args) {
            var datePicker = $find("<%=rdpDateTimeField.ClientID %>");
            datePicker.clear();
            datePicker.hidePopup();
        }
    </script>

I added a RadButton to the FooterTemplate of the Calendar control and attached an event that clears the datepicker control and hides the popup (you can remove this line, if you want it to remain open).

I hope that helps.
Tags
Calendar
Asked by
Mich Meow
Top achievements
Rank 1
Answers by
Kevin
Top achievements
Rank 2
Share this question
or