Home > sharepoint > SharePoint DateTimeControl Validation

SharePoint DateTimeControl Validation

I have been using a DateTimeControl for a custom webpart and it is really nice (especially because I get a similar look and feel to the DateTimecontrols on the SharePoint list). However, I noticed one small drawback with it – Validation.
Internally the DateTimeControl of SharePoint is just a calendar dropdown and a text box. Also, they already implemented a simple required field validation by just using the IsRequiredField property. However, if you try to put an asp.net validator (i.e.: CompareValidator, RegularExpressionValidtator, etc…) on it, it says it can’t find the control. This is happening because the DateTimeControl is just a wrapper around this textbox and if you set the Validator ControlToValidate property to the DateTimeControl it isn’t smart enough to know to really validate against the actual textbox.
So, how do we accomplish this. Actually, it is pretty easy – SharePoint is giving an ID to that Textbox programatically and this ID is the same name as your control with the word “Date” added to the end.
So, in your ControlToValidate just put “{nameofcontrol}${nameofcontrol}Date”.
Here is an example:

<SharePoint:DateTimeControl ID="dteDemo" runat="server" DateOnly="true" />
 <asp:CompareValidator id="valDate" runat="server"
         ForeColor="Red"
         ControlToValidate="dteDemo$dteDemoDate"
         Type="Date"
          Operator="DataTypeCheck"
          ErrorMessage="Please enter an valid date">
</asp:CompareValidator >
Categories: sharepoint
  1. September 9, 2008 at 1:35 pm

    brilliant…was stuck…your post helped me greatly…thanks 🙂

  2. Pallavi
    September 12, 2008 at 7:43 am

    The post is really helpful!

  3. Renat
    December 3, 2008 at 2:50 pm

    Thanks a lot!
    Really clear description of the problem
    And nice solution

  4. gaurav
    December 15, 2008 at 12:52 pm

    If you use compare validator and enter invalid date in textbox. the invalid date message will come but the error message will not get clear if you select the correct date from the calendar image icon.

  5. Brad
    January 21, 2009 at 3:39 pm

    This seems to only validate the date, Is there a way to specify Date and Time.

    Thanks!
    Brad

  6. Bob
    February 11, 2009 at 1:44 pm

    I’ve tried your suggestion, but have trouble with the control name – on my DateTime fields, the names wind up something like:

    <input … name=”ctl00$m$g_0482d57d_fb6e_4f7d_883d_3e554001deb5$ctl00$ctl04$ctl02$ctl00$ctl00$ctl04$ctl00$ctl00$DateTimeField$DateTimeFieldDate” …

    Any suggestions?

  7. VT Brad
    February 19, 2009 at 6:31 pm

    Gaurav,

    I had the same problem and was able to fix it by forcing a client-side validation. Just set the OnValueChangeClientScript property to “Page_ClientValidate(\”\”);”

    Hope this helps,

    Brad

  8. April 2, 2009 at 12:59 pm

    Genious!

    For people who want to use the DateTimeControl within an InputFormSection, beware that you must encapsulate it within an InputFormControl in order to get the styling right. Also make sure you put the validators within the Templace_Control of the InputFormControl or else the trick described in this post won’t work.

    For example:

  9. April 2, 2009 at 1:08 pm

    Appearantly this forum can’t handle HTML tags in postings too well. Another attempt for the example:

    >wssuc:InputFormSection runat=”server” ID=”MyDateSection” Title=”Enter your date” Description=”This is the place where you can enter a date”<
    >template_inputformcontrols<
    >wssuc:InputFormControl runat=”server”<
    >Template_Control<
    >SharePoint:DateTimeControl ID=”MyDatePicker” runat=”server” DateOnly=”true” /<
    >asp:CompareValidator ID=”MyDateCompareValidator” runat=”server” ControlToValidate=”MyDatePicker$MyDatePickerDate” Type=”Date” Operator=”DataTypeCheck” ErrorMessage=”Invalid date” /<
    >/Template_Control<
    >/wssuc:InputFormControl<
    >/template_inputformcontrols<
    >/wssuc:InputFormSection<

  10. April 2, 2009 at 1:09 pm

    Almost right. Last attempt:

    <wssuc:InputFormSection runat=”server” ID=”MyDateSection” Title=”Enter your date” Description=”This is the place where you can enter a date”>
    <template_inputformcontrols>
    <wssuc:InputFormControl runat=”server”>
    <Template_Control>
    <SharePoint:DateTimeControl ID=”MyDatePicker” runat=”server” DateOnly=”true” />
    <asp:CompareValidator ID=”MyDateCompareValidator” runat=”server” ControlToValidate=”MyDatePicker$MyDatePickerDate” Type=”Date” Operator=”DataTypeCheck” ErrorMessage=”Invalid date” />
    </Template_Control>
    </wssuc:InputFormControl>
    </template_inputformcontrols>
    </wssuc:InputFormSection>

  1. June 29, 2008 at 12:00 pm
  2. June 29, 2008 at 11:37 pm
  3. July 29, 2008 at 9:15 pm
  4. December 17, 2008 at 12:40 pm
  5. December 17, 2008 at 12:41 pm
  6. December 17, 2008 at 1:53 pm
  7. February 24, 2009 at 6:18 pm

Leave a comment