How do I validate a GridDateTimeColumn for valid date?

7 posts, 0 answers
  1. Steve
    Steve avatar
    84 posts
    Member since:
    Aug 2013

    Posted 18 Jan 2014 Link to this post

    I have a grid with a GridDateTimeColumn. I do InPlace editing on the grid. I need to validate that the date entered is a valid date. I can't see to determine how to do this. I tried the RequiredFieldValidator, but that doesn't work correctly. If I enter an invalid date, and click the update button, the date field gets the red box around it and the grid goes out of edit mode and reverts rebinds.

    How can I flag the invalid date, notify the user the date is invalid and keep the grid in edit mode?

    This is my grid.

    <telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True"
          AllowSorting="True" DataSourceID="Datasource"
          AllowAutomaticUpdates="true" AllowAutomaticInserts="true"
          AllowAutomaticDeletes="true" ShowFooter="true"
          Skin="Forest" PageSize="100"
          OnItemCommand="RadGrid1_ItemCommand"
          CellSpacing="0" GridLines="None">
          <ClientSettings>
                    <Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="true"></Scrolling>
          </ClientSettings>
     
            <MasterTableView AutoGenerateColumns="false" EditMode="InPlace" DataKeyNames="ID"
               AllowAutomaticUpdates="true" AllowAutomaticInserts="true"
               AllowAutomaticDeletes="true"  DataSourceID="Datasource"
               CommandItemDisplay="Top">
                <CommandItemTemplate>
                    <div style="padding: 5px 5px;">
                            <asp:LinkButton ID="LinkButton2" runat="server" CommandName="InitInsert" Visible='<%# Not RadGrid1.MasterTableView.IsItemInserted%>'><img style="border:0px;vertical-align:middle;" alt="" src="../Images/AddRecord.gif"/>Add new description</asp:LinkButton>  
                            <asp:LinkButton ID="LinkButton3" runat="server" CommandName="PerformInsert" Visible='<%# RadGrid1.MasterTableView.IsItemInserted %>'><img style="border:0px;vertical-align:middle;" alt="" src="../Images/Insert.gif"/>Add this description</asp:LinkButton>  
                            <asp:LinkButton ID="LinkButton7" runat="server" CommandName="CancelAll" Visible='<%# RadGrid1.MasterTableView.IsItemInserted%>'><img style="border:0px;vertical-align:middle;" alt="" src="../Images/Cancel.gif"/>Cancel</asp:LinkButton>  
                            <asp:LinkButton ID="LinkButton1" runat="server" CommandName="EditSelected" Visible='<%# RadGrid1.EditIndexes.Count = 0%>'><img style="border:0px;vertical-align:middle;" alt="" src="../Images/Edit.gif"/>Edit this description</asp:LinkButton>  
                            <asp:LinkButton ID="LinkButton5" runat="server" CommandName="UpdateEdited" Visible='<%# RadGrid1.EditIndexes.Count > 0%>'><img style="border:0px;vertical-align:middle;" alt="" src="../Images/Update.gif"/>Update this description</asp:LinkButton>  
                            <asp:LinkButton ID="LinkButton6" runat="server" CommandName="CancelAll" Visible='<%# RadGrid1.EditIndexes.Count > 0%>'><img style="border:0px;vertical-align:middle;" alt="" src="../Images/Cancel.gif"/>Cancel</asp:LinkButton>  
                            <asp:LinkButton ID="LinkButton8" OnClientClick="javascript:return confirm('Deactivate selected description?')" runat="server" CommandName="DeleteSelected"><img style="border:0px;vertical-align:middle;" alt="" src="../Images/Delete.gif"/>Deactivate selected description</asp:LinkButton>  
                            <asp:LinkButton ID="LinkButton4" runat="server" CommandName="RebindGrid"><img style="border:0px;vertical-align:middle;" alt="" src="../Images/Refresh.gif"/>Refresh description display</asp:LinkButton>
                    </div>
                </CommandItemTemplate>
     
                <SortExpressions>
                    <telerik:GridSortExpression FieldName="DateHoliday" SortOrder="Ascending" />
                </SortExpressions>
                <Columns>
                    <telerik:GridBoundColumn DataField="ID"  UniqueName="ID" Visible="false" ReadOnly="true" />
                    <telerik:GridBoundColumn DataField="Description" HeaderText="Description" UniqueName="Description"/>
                    <telerik:GridDateTimeColumn DataField="DateHoliday" HeaderText="Date of Holiday" UniqueName="DateHoliday" PickerType="DatePicker" DataFormatString="{0:MM/dd/yyyy}" >
                        <ColumnValidationSettings EnableRequiredFieldValidation="true" >
                            <RequiredFieldValidator runat="server" ErrorMessage="Please enter a valid date."></RequiredFieldValidator>
                        </ColumnValidationSettings>
                    </telerik:GridDateTimeColumn>
                    <telerik:GridDateTimeColumn DataField="TimeOpen" HeaderText="Opening time" UniqueName="TimeOpen" PickerType="TimePicker" DataFormatString="{0:t}" />
                    <telerik:GridDateTimeColumn DataField="TimeClosed" HeaderText="Closing Time" UniqueName="TimeClosed" PickerType="TimePicker" DataFormatString="{0:t}"/>
                    <telerik:GridCheckBoxColumn DataField="Active" UniqueName="Active" HeaderText="Active" />
                </Columns>
            </MasterTableView>
            <ClientSettings EnableRowHoverStyle="true" EnablePostBackOnRowClick="true">
                <Selecting AllowRowSelect="true" EnableDragToSelectRows="false" />
            </ClientSettings>
             
        </telerik:RadGrid>
  2. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1793 posts

    Posted 22 Jan 2014 Link to this post

    Hi Steve,

    The RequiredFieldValidator is working as expected on my end for the "DateHoliday" column when invalid date is entered. Please note that you have set the EnablePostBackOnRowClick property to "true" and it is possible that you are actually clicking on the row and not on the Update button.

    Another thing that you should keep in mind is the default behavior of all pickers when incomplete dates are entered, which is documented and explained in details in this help article.

    Please add RequiredFieldValidator to the other column and try to temporarily disable the post back on row click, and see if the same behavior is observed on your end.


    Regards,
    Konstantin Dikov
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Steve
    Steve avatar
    84 posts
    Member since:
    Aug 2013

    Posted 23 Jan 2014 Link to this post

    I had noticed the EnablePostBackOnRowClick was set to true also and had set it to false. That made no difference. I added the RequiredFieldValidator, but all that did was turn the border around the date red and then took the row out of edit mode and reverted the date back to the original date.

    For an invalid date, I am entering 33/33/2014. I then click the update button in the commanditem area. The border around the date textbox turns red, reverts back to the original date and the whole row is take out of edit mode.
  5. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1793 posts

    Posted 28 Jan 2014 Link to this post

    Hello Steve,

    I have tested the this on my end with invalid date "33/33/2014" and I was unable to observe the described behavior. 

    For your convenience I have prepared a sample page with simplified version of your grid settings that works as expected on my end. Please test the attached files on your side and see if the same behavior is observed.

    I am looking forward to your reply with the results.


    Regards,
    Konstantin Dikov
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
  6. Peter
    Peter avatar
    98 posts
    Member since:
    Mar 2012

    Posted 12 Mar 2015 in reply to Konstantin Dikov Link to this post

    I have a "GridDateTimeColumn" that never fires the validation. I have reviewed the sample and everything looks OK. I have also looked at "DefaultInsertValue" and "ConvertEmptyStringToNull", but have had no success.

    The other validator on the "GridBoundColumn" is working fine - why isn't the "GridDateTimeColumn" working?
  7. Peter
    Peter avatar
    98 posts
    Member since:
    Mar 2012

    Posted 13 Mar 2015 in reply to Peter Link to this post

    As per this post:

    As I had separate Validation Groups / Multiple Grids I had to:

    1. On the grid, set <ValidationSettings EnableValidation="true" ValidationGroup="MyValidationGroup" />
    2. On the control, repeat the ValidationGroup:

    <ColumnValidationSettings EnableRequiredFieldValidation="true">
                                                        <RequiredFieldValidator Enabled="true" ForeColor="Red" ErrorMessage="required" Text="* required" ValidationGroup="SiteComplianceReview" />
                                                    </ColumnValidationSettings>

    3. Just in case, include separate ValidationSummary in the AJAX:

            <telerik:AjaxSetting AjaxControlID="rgGrid">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="rgGrid" />
                    <telerik:AjaxUpdatedControl ControlID="vsGrid" />
                </UpdatedControls>
            </telerik:AjaxSetting>

    (4. Ensure no Visible="false" was on the validatior!)

  8. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    1793 posts

    Posted 17 Mar 2015 Link to this post

    Hi Peter,

    The issue that you are observing with your settings is due to the fact that you have multiple validation groups and when you click on the update button, the validation for the GridDateTimeColumn will not be fired, because the Update button will validate the "MyValidationGroup".

    In order to have the validation to fire for your RadDatePicker you will need to ensure that the ValidationGroup is the same for the Update button and for the RadDatePicker:
    <telerik:RadGrid ID="RadGrid1" runat="server" OnNeedDataSource="RadGrid1_NeedDataSource" ValidationSettings-ValidationGroup="SiteComplianceReview">
        <MasterTableView AutoGenerateColumns="false" EditMode="InPlace" CommandItemDisplay="Top">
            <Columns>
                <telerik:GridEditCommandColumn></telerik:GridEditCommandColumn>
                <telerik:GridDateTimeColumn DataField="Date" HeaderText="Date of Holiday" UniqueName="DateHoliday" PickerType="DatePicker" DataFormatString="{0:MM/dd/yyyy}">
                    <ColumnValidationSettings EnableRequiredFieldValidation="true">
                        <RequiredFieldValidator Enabled="true" ForeColor="Red" ErrorMessage="required" Text="* required" ValidationGroup="SiteComplianceReview" />
                    </ColumnValidationSettings>
                </telerik:GridDateTimeColumn>
            </Columns>
            <CommandItemTemplate>
                <div style="padding: 5px 5px;">
                    <asp:LinkButton ID="LinkButton5" runat="server" CommandName="UpdateEdited" Visible='<%# RadGrid1.EditIndexes.Count > 0%>'>
                        <img style="border:0px;vertical-align:middle;" alt="" src="../Images/Update.gif"/>Update this description</asp:LinkButton>
                </div>
            </CommandItemTemplate>
        </MasterTableView>
    </telerik:RadGrid>
     
    <asp:ValidationSummary runat="server" ID="ValidationSummary1" ValidationGroup="SiteComplianceReview" />

    Hope this helps.


    Regards,
    Konstantin Dikov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017