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

Compare two date picker values in RadGrid

13 Answers 245 Views
Grid
This is a migrated thread and some comments may be shown as answers.
rock
Top achievements
Rank 1
rock asked on 10 Aug 2010, 07:10 AM
Hi, I have a rad grid that contains two columns for StartDate and EndDate with RadDatePickers.
I am using compare validator to validate selected date in both controls with parameters according to my project needs.
At last i want to compare that the date selected in "EndDate" should not be less than the date selected in "StartDate".
How can i supply value of "StartDate" column's control to the CompareValidator's ValueToCompare property of "EndDate" column ?
P.S. My column type is GridTemplateCoulmn and both the Start and End date pickers are in EditItemTemplate.
Help is needed asap.
Thanks in Advance.

13 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 1
answered on 12 Aug 2010, 11:57 AM
Hello,

Check out the following sample code to achieve this.

ASPX:
<telerik:GridTemplateColumn>
    <EditItemTemplate>
        StartDate:
        <telerik:RadDatePicker ID="RadDatePicker1" runat="server">
        </telerik:RadDatePicker>                      
    </EditItemTemplate>
</telerik:GridTemplateColumn>
 <telerik:GridTemplateColumn>
    <EditItemTemplate>
        EndDate
        <telerik:RadDatePicker ID="RadDatePicker2" runat="server">
        </telerik:RadDatePicker>
        <asp:CompareValidator ID="CompareValidator1" runat="server"></asp:CompareValidator>
    </EditItemTemplate>
</telerik:GridTemplateColumn>

C#:
protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
   {
       if (e.Item is GridEditFormItem && e.Item.IsInEditMode)
       {
           GridEditFormItem editItem = (GridEditFormItem)e.Item;
           RadDatePicker picker1 = (RadDatePicker)editItem.FindControl("RadDatePicker1");
           DateTime startDate =Convert.ToDateTime(picker1.SelectedDate);
           RadDatePicker picker2 = (RadDatePicker)editItem.FindControl("RadDatePicker2");
           CompareValidator compValidate = (CompareValidator)editItem.FindControl("CompareValidator1");
           compValidate.ControlToValidate = picker2.ID;
           compValidate.ControlToCompare = picker1.ID;
           compValidate.Operator = ValidationCompareOperator.GreaterThan;
           compValidate.ErrorMessage = "EndDate should not be less than StartDate";       
       }
   }

Thanks,
Princy.
0
rock
Top achievements
Rank 1
answered on 14 Aug 2010, 11:20 AM
thank i will appy in my form
0
Miguel
Top achievements
Rank 1
answered on 09 Dec 2010, 02:13 AM
Hi Princy,

How can I get the same functionality if I am using GridDateTimeColumns instead of Template columns, but I want the validation to happen in the Client Side. I mean, as soon as the client picks the Second date in the insert form, it needs to validate against the First Date and displays the message error if less.
It can not wait until the client hits the insert command to display the result of this validation. It has to happen right away the second date is selected.

Thanks!
Miguel
0
Princy
Top achievements
Rank 1
answered on 09 Dec 2010, 09:49 AM
Hello Miguel,

Check out the following code snippet which shows how to achieve the desired functionality.
ASPX:
<telerik:GridDateTimeColumn UniqueName="GridDateTimeColumn1" DataField="StartDate">
</telerik:GridDateTimeColumn>
<telerik:GridDateTimeColumn UniqueName="GridDateTimeColumn2" DataField="EndDate">
</telerik:GridDateTimeColumn>

<asp:HiddenField ID="HiddenField1" runat="server" />

C#:
protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
   {
       if (e.Item is GridEditFormInsertItem && e.Item.OwnerTableView.IsItemInserted)
       {
           GridEditFormInsertItem insertItem = (GridEditFormInsertItem)e.Item;
           RadDatePicker datepick1 = (RadDatePicker)insertItem["GridDateTimeColumn1"].Controls[0];
           RadDatePicker datepick2 = (RadDatePicker)insertItem["GridDateTimeColumn2"].Controls[0];
           HiddenField1.Value = datepick1.ClientID;
           datepick2.ClientEvents.OnDateSelected = "DateSelected";
        }
   }

Java Script:
<script type="text/javascript">
    function DateSelected(sender, args) {
        var EndDate = new Date(args.get_newValue());
        var datePicker1 = $find(document.getElementById('HiddenField1').value);
        var StartDate = new Date(datePicker1.get_dateInput().get_value());
        if (StartDate  > EndDate) {
            alert("in valid date");
            sender.clear();
         }
    }
</script>

Thanks,
Princy.
0
Miguel
Top achievements
Rank 1
answered on 09 Dec 2010, 02:04 PM
Hi Princy, thanks for your response...

I get this exception at execution time when I hit the Add New Record Command:

Microsoft JScript runtime error: Sys.WebForms.PageRequestManagerServerErrorException: Specified argument was out of the range of valid values.
Parameter name: index

The execption is raised in this line  ----->

if(e.Item is GridEditFormItem && e.Item.OwnerTableView.IsItemInserted)
      {
          GridEditFormItem insertItem = (GridEditFormItem)e.Item;
  ------>    RadDatePicker datepick1 = (RadDatePicker)insertItem["GridDateTimeColumn1"].Controls[0];
          RadDatePicker datepick2 = (RadDatePicker)insertItem["GridDateTimeColumn2"].Controls[0];
          HiddenField1.Value = datepick1.ClientID;
          datepick2.ClientEvents.OnDateSelected = "DateSelected";
       }

I am not sure if the Controls[0] is not returning what it should. 

I appreciate your help.

Regards-
Miguel 
0
Princy
Top achievements
Rank 1
answered on 10 Dec 2010, 06:26 AM
Hello Miguel,

Since you are accessing the RadDatePicker control in insert form, the grid item is of type GridEditFormInsertItem. Try to access the RadDatePicker like below.

C#:
protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
   {
       if (e.Item is GridEditFormInsertItem && e.Item.OwnerTableView.IsItemInserted)
       {
           GridEditFormInsertItem insertItem = (GridEditFormInsertItem)e.Item;
           RadDatePicker datepick1 = (RadDatePicker)insertItem["GridDateTimeColumn1"].Controls[0];
           . . . . . . . . .
       }
   }

Thanks,
Princy.
0
Miguel
Top achievements
Rank 1
answered on 10 Dec 2010, 05:41 PM
Hi Princy, the GridEditFormInsertItem worked. but now I am getting a JavaScript error:

Microsoft JScript runtime error: Object required

At line:

function DateSelected(sender, args) {
       var EndDate = new Date(args.get_newValue());
  ----> var datePicker1 = $find(document.getElementById('HiddenField1').value);


I was doing a little of research and found that this could happen because of the ajax postback.

Do you have any idea why this is happening?

Thanks a lot!
Miguel
0
Miguel
Top achievements
Rank 1
answered on 10 Dec 2010, 08:39 PM

Hi Princy, I tried this but I got a new error in the folling line:

Microsoft JScript runtime error: 'null' is null or not an object

function DateSelected(sender, args) {
             var EndDate = new Date(args.get_newValue());        
              //var datePicker1 = $find(document.getElementById('HiddenField1').value);
              var datePicker1 = $find( "<%= HiddenField1.UniqueID %>")
          ----->    var StartDate = new Date(datePicker1.get_dateInput().get_value());
0
Princy
Top achievements
Rank 1
answered on 13 Dec 2010, 07:16 AM
Hello Miguel,

Try to include HiddenField1 into UpdatedControls of RadAjaxManager and check whether it resolves the error.

ASPX:
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="HiddenField1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

Thanks,
Princy.
0
Miguel
Top achievements
Rank 1
answered on 14 Dec 2010, 08:27 PM
Great!!! It is working now.

Thanks Princy!
0
Nimisha
Top achievements
Rank 1
answered on 24 Aug 2015, 09:33 AM
hello,

         I tried your above code but its not work for me. i am using rad grid in batch edit mode. i have two date start date and End date.
i want to validate that start date should be lesser than end date.
        Thanks in advance
0
Nimisha
Top achievements
Rank 1
answered on 24 Aug 2015, 09:33 AM
hello,

         I tried your above code but its not work for me. i am using rad grid in batch edit mode. i have two date start date and End date.
i want to validate that start date should be lesser than end date.
        Thanks in advance 
0
Eyup
Telerik team
answered on 27 Aug 2015, 07:40 AM
Hi Nimisha,

Please note that Batch editing mode is different than other modes. You can find a detailed explanation in the following section:
http://docs.telerik.com/devtools/aspnet-ajax/controls/grid/rows/accessing-cells-and-rows#accessing-controls-in-batch-edit-mode


Regards,
Eyup
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Grid
Asked by
rock
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 1
rock
Top achievements
Rank 1
Miguel
Top achievements
Rank 1
Nimisha
Top achievements
Rank 1
Eyup
Telerik team
Share this question
or