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

In a radgrid, update textbox with the difference of 2 RadTimepickers values in the same grid cell

1 Answer 38 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jose
Top achievements
Rank 2
Jose asked on 11 May 2010, 12:14 AM
I have 2 timepicker and a numeric text box in each grid cell.  So as the user makes a selection on either of the Timepickers the , numeric txtbox is supposed to show the differences of the two selections.  I need to to find a way to accomplish this behaviour.  Any help is appreciated.

Heres my itemtemplate in the grid.

 <ItemTemplate>
                                    <table  >
                                        <tr>
                                            <td align="center">
                                                <asp:CheckBox ID="cb7" runat="server"   />
                                                <asp:Label    ID="lb7" runat="server" />
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="left">
                                            <telerik:RadTimePicker ID="txt_InD7" runat="server" Width="86"></telerik:RadTimePicker>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="left">
                                              <telerik:RadTimePicker ID="txt_OutD7" runat="server" Width="86"></telerik:RadTimePicker>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="left">
                                        
                                            <telerik:RadNumericTextBox ID ="txt_MinD7" runat="server" MaxLength="3" Width="54"></telerik:RadNumericTextBox>
                                            <asp:CompareValidator ID="CompareValidator7" runat="server"  ControlToCompare="txt_InD7" ControlToValidate="txt_OutD7" Operator="GreaterThan" ErrorMessage="*"></asp:CompareValidator>
                                            </td>
                                        </tr>
                                    </table>
                                   
                            </ItemTemplate> 

1 Answer, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 11 May 2010, 11:08 AM
Hello Robert,

Try the following approach by attaching 'OnDateSelected' event to RadTimePickers and setting the difference between selected time' to RadTextBox in the event handler.

ASPX:
 
    . . . 
    <td align="left"
        <telerik:RadTimePicker ID="txt_InD7" runat="server" Width="86"
        </telerik:RadTimePicker> 
    </td> 
</tr> 
<tr> 
    <td align="left"
        <telerik:RadTimePicker ID="txt_OutD7" runat="server" Width="86"
            <ClientEvents OnDateSelected="OnDateSelected" /> 
        </telerik:RadTimePicker> 
      . . . 
 


JavaScript:
 
<script type="text/javascript"
    function timeDifference(laterdate, earlierdate) { 
        var difference = laterdate.getTime() - earlierdate.getTime(); 
        var daysDifference = Math.floor(difference / 1000 / 60 / 60 / 24); 
        difference -= daysDifference * 1000 * 60 * 60 * 24 
        var hoursDifference = Math.floor(difference / 1000 / 60 / 60); 
        return (hoursDifference); 
    } 
    function OnDateSelected(sender, args) { 
        var grid = $find("<%=RadGrid1.ClientID %>"); 
        var MasterTable = grid.get_masterTableView(); 
        var length = MasterTable.get_dataItems().length; 
        for (var i = 0; i < length; i++) { 
            var timePicker2 = MasterTable.get_dataItems()[i].findControl("txt_OutD7"); 
            if (sender.get_id() == timePicker2.get_id()) { 
                var timePicker1 = MasterTable.get_dataItems()[i].findControl("txt_InD7"); 
                var numtext = MasterTable.get_dataItems()[i].findControl("txt_MinD7"); 
                var dt1 = new Date(); 
                var dt2 = new Date(); 
                dt2 = timePicker2.get_selectedDate(); 
                dt1 = timePicker1.get_selectedDate(); 
                numtext.set_value(timeDifference(dt2, dt1));  // Set the NumericTextBox value 
            } 
        } 
    } 
</script> 

Feel free to alter the logic according to your requirement.

Regards,
Shinu.
Tags
Grid
Asked by
Jose
Top achievements
Rank 2
Answers by
Shinu
Top achievements
Rank 2
Share this question
or