Question

我有一个gridview，如下图所示：

gridview

我在gridview的ItemTemplate中有文本框。我想计算两个日期之间的天数，并用值填充最后一个文本框。我可以在OnTextChanged事件中做到这一点，但我不想要回发。 Plz让我如何使用javascript函数？（传递文本框值并填充TextBox）

                <asp:TemplateField HeaderText="Date of Submission for Xerox review" HeaderStyle-BackColor="#1B7AE0" HeaderStyle-Font-Size="10"> 
                <EditItemTemplate> 
              <asp:TextBox ID="IDDtXerox" Text='<%# Eval("Date_Xerox_Review") %>' BorderWidth="1" runat="server"></asp:TextBox>
                            <ajaxToolkit:CalendarExtender ID="CalendarExtender3" runat="server"  Format="dd/MM/yyyy"

                                        TargetControlID="IDDtXerox" /> 
            </EditItemTemplate> 
            <FooterTemplate> 
              <asp:TextBox ID="txtNewIDDtXerox" BorderWidth="1" runat="server"></asp:TextBox> 
               <ajaxToolkit:CalendarExtender ID="CalendarExtender4" runat="server" Format="dd/MM/yyyy"

                                        TargetControlID="txtNewIDDtXerox" /> 
              </FooterTemplate> 
            <ItemTemplate> 
              <asp:Label ID="lblIDDtXerox" Font-Size="Smaller" Text='<%# Bind("Date_Xerox_Review") %>' runat="server"></asp:Label> 
            </ItemTemplate> 

            <HeaderStyle BackColor="#1B7AE0" Font-Size="10pt"></HeaderStyle>
            </asp:TemplateField> 
            <asp:TemplateField HeaderText="Date of ID Acceptance/Rejection" HeaderStyle-BackColor="#1B7AE0" HeaderStyle-Font-Size="10"> 
                <EditItemTemplate> 
              <asp:TextBox ID="IDDtAccRej" Text='<%# Eval("Date_Acceptance_Rejection") %>' BorderWidth="1" runat="server"></asp:TextBox>
                <ajaxToolkit:CalendarExtender ID="CalendarExtender5" Animated="true"  runat="server" Format="dd/MM/yyyy" TargetControlID="IDDtAccRej" /> 
            </EditItemTemplate> 
            <FooterTemplate> 
              <asp:TextBox ID="txtNewIDDtAccRej" BorderWidth="1" AutoPostBack="true" OnTextChanged="txtNewIDDtAccRej_TextChanged" runat="server"></asp:TextBox> 
               <ajaxToolkit:CalendarExtender ID="CalendarExtender6" runat="server" Format="dd/MM/yyyy" TargetControlID="txtNewIDDtAccRej" /> 
              </FooterTemplate> 
            <ItemTemplate> 
              <asp:Label ID="lblIDDtAccRej" Font-Size="Smaller" Text='<%# Bind("Date_Acceptance_Rejection") %>' runat="server"></asp:Label> 
            </ItemTemplate> 
            <HeaderStyle BackColor="#1B7AE0" Font-Size="10pt"></HeaderStyle>
            </asp:TemplateField> 

                 <asp:TemplateField HeaderStyle-BackColor="#1B7AE0" HeaderStyle-Font-Size="10" HeaderText="ID Process Cycle Time (Weekdays)">
                <EditItemTemplate>  
               <asp:TextBox ID="txtProcessTime" BackColor="#E3C5AF" Text='<%# Eval("ID_Process_Time") %>' ReadOnly="true" Width="50px" BorderWidth="1" runat="server"></asp:TextBox>
            </EditItemTemplate> 
            <FooterTemplate> 
              <asp:TextBox ID="txtNewProcessTime" BackColor="#E3C5AF" ReadOnly="true" Width="50px" BorderWidth="1" runat="server"></asp:TextBox> 
              </FooterTemplate> 
            <ItemTemplate> 
              <asp:Label ID="lblNewProcessTime" Font-Size="Smaller" Text='<%# Bind("ID_Process_Time") %>' runat="server"></asp:Label> 
            </ItemTemplate> 
            <HeaderStyle BackColor="#1B7AE0" Font-Size="10pt"></HeaderStyle>
            </asp:TemplateField>

请帮助？

Answer 1

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <script type="text/javascript">
            function calculateDifference()
            {
                var startDate = document.getElementById("start_date").value;

                if(startDate == "")
                {
                    alert("Enter start date");
                    return;
                }
                var endDate = document.getElementById("end_date").value;
                if(endDate == "")
                {
                    alert("Enter end date");
                    return;
                }

                var startDateSplit = startDate.split("/");
                var endDateSplit = endDate.split("/");

                var stDate = new Date(startDateSplit[2], startDateSplit[0]-1, startDateSplit[1]);
                var enDate = new Date(endDateSplit[2], endDateSplit[0]-1, endDateSplit[1]);


                var difference = (enDate.getTime() - stDate.getTime())/(1000*60*60*24);

                document.getElementById("date_difference").value = difference;
            }
        </script>
    </head>
    <body>
        <table>
            <tr>
                <td>
                    <input type="text" name="start_date" id="start_date" onchange="calculateDifference()" />
                </td>
                <td>
                    <input type="text" name="end_date" id="end_date" onchange="calculateDifference()" />
                </td>
                <td>
                    <input type="text" name="date_difference" id="date_difference" />
                </td>
            </tr>
        </table>
    </body>
</html>

Answer 2

尝试这种方法：

1.制作一个功能 2.通过文本框值 3.填写TextBox

function get_date_difference(t1,t2){
          //  t1="10/10/2006" ;

          //  t2="15/10/2006";


       //Total time for one day
            var one_day=1000*60*60*24; 
    //Here we need to split the inputed dates to convert them into standard format
    for furter execution
            var x=t1.split("/");     
            var y=t2.split("/");
      //date format(Fullyear,month,date) 

            var date1=new Date(x[2],(x[1]-1),x[0]);

            var date2=new Date(y[2],(y[1]-1),y[0])
            var month1=x[1]-1;
            var month2=y[1]-1;

            //Calculate difference between the two dates, and convert to days

            Diff=Math.ceil((date2.getTime()-date1.getTime())/(one_day)); 
    //Diff gives the diffrence between the two dates.
        return Diff
}

如何计算asp.net gridview itemtemplate文本框中javascript中两个日期之间的天数

2 个答案: