Question

我们有一个javascript，它接受开始日期和结束日期，计算它们之间的差异，并将值存储在名为hourDiff的变量中。

这是js的相关部分。

为了避免范围问题，在任何函数之外的javascript顶部定义了一个名为hourDiff的gobal变量“

var hourDiff = 0;

//Calulate the time difference and store the value in hourDiff
hourDiff = endDate - startDate;

我们的想法是最终将hourDiff附加到下面的gridview超链接控件，并将名称 - 值对作为查询字符串传递给另一个名为Reseve.aspx的页面

<asp:HyperLink ID="siteId" class="js_siteid" style="color:#111" runat="server" navigateurl='<%# String.Format("Reserve.aspx?id={0}&groupsize={1}&facilityFees={2}&extrahour={3}&depoitAmt={4}&cancelAmt={5}&keydeptAmt={6}", Eval("siteId"), Eval("capacity"),Eval("RentalFeeAmount"),Eval("ExtraHourAmount"),Eval("DepositAmount"),Eval("CancellationAmount"),Eval("KeyDepositAmount")) %>' Text='Select' />

由于在点击搜索按钮之后，超链接未暴露给javascript，我在下面有另一个javascript用于将timediff添加到超链接并传递到另一个页面。

这个javascript位于html页面的底部：

<script type="text/javascript">
var links = document.getElementsByClassName("js_siteid");
if ( links.length > 0 )
{
    links[0].onclick = function() {
        this.href += ( "&hoursdiff=" + hourDiff );
        return true;
    }
}
</script>
</body>
</html>


  <script type="text/javascript">
                 **var hourDiff = 0;**
                $(window).load(function () {
                    $("#txtFromDate").datepicker();
                    $('#timeStart').timepicker({ showPeriod: true,
                        onHourShow: OnHourShowCallback,
                        onMinuteShow: OnMinuteShowCallback
                    });

                    $("#txtToDate").datepicker();
                    $('#timeEnd').timepicker({ showPeriod: true,
                        onHourShow: OnHourShowCallback,
                        onMinuteShow: OnMinuteShowCallback
                    });
                    function OnHourShowCallback(hour) {
                        if ((hour > 20) || (hour < 6)) {
                            return false; // not valid
                        }
                        return true; // valid
                    }
                    function OnMinuteShowCallback(hour, minute) {
                        if ((hour == 20) && (minute >= 30)) { return false; } // not valid
                        if ((hour == 6) && (minute < 30)) { return false; }   // not valid
                        return true;  // valid
                    }
                    $('#btnSearch').on('click', function () {
                        var sDate = $("#txtFromDate").val();
                        var sTime = $("#timeStart").val();

                        var eDate = $("#txtToDate").val();
                        var eTime = $("#timeEnd").val();

                        var startDate = new Date(sDate + " " + sTime).getHours();
                        var endDate = new Date(eDate + " " + eTime).getHours();

                        //Calulate the time difference
                         **hourDiff = endDate - startDate;**
                        //alert(hourDiff);

                        //Check if hour difference is less than 4 hours and show the message accordingly
                        if (hourDiff < 4) {
                            var r = false; $($("<div>A mininum of 4 hours is required!</div>")).dialog({ closeOnEscape: false, resizable: false, modal: true, open: function (event, ui) { $(".ui-dialog-titlebar-close").hide(); }, buttons: { Close: function () { r = false; $(this).dialog("close"); } }, close: function () { return r; } });
                            return false;
                        }

                        //Add the check condition if the user is above the 4 hours time frame
                        if (hourDiff > 4) {
                            var r = confirm("There may be additional fees for going over the 4 hours!");
                            if (r == true) { // pressed OK
                                return true;
                            } else { // pressed Cancel
                                return false;
                            }
                        }
                    });
                });
        </script>

每次编译我的代码并使用Select链接时，hourDiff始终显示值0而不是开始日期和结束日期之间的差异。

任何想法我做错了什么？

Protected Sub ValidateDuration(ByVal sender As Object, ByVal args As ServerValidateEventArgs)
  Dim validator As Control = DirectCast(sender, Control)
  Dim row As Control = validator.NamingContainer

  Dim startHour As Integer = Integer.Parse(DirectCast(row.FindControl("startHour"), DropDownList).SelectedValue)
  Dim startMinutes As Integer = Integer.Parse(DirectCast(row.FindControl("startMinutes"), DropDownList).SelectedValue)
  Dim startAmPm As String = DirectCast(row.FindControl("startAmPm"), DropDownList).SelectedValue

  Select Case startAmPm
    Case "AM"
        If startHour = 12 Then
            startHour = 0
        End If

    Case "PM"
        If startHour <> 12 Then
            startHour += 12
        End If

    Case Else
        args.IsValid = True
        Return
  End Select

  Dim endHour As Integer = Integer.Parse(DirectCast(row.FindControl("endHour"), DropDownList).SelectedValue)
  Dim endMinutes As Integer = Integer.Parse(DirectCast(row.FindControl("endMinutes"), DropDownList).SelectedValue)
  Dim endAmPm As String = DirectCast(row.FindControl("endAmPm"), DropDownList).SelectedValue

  Select Case endAmPm
    Case "AM"
        If endHour = 12 Then
            endHour = 0
        End If

    Case "PM"
        If endHour <> 12 Then
            endHour += 12
        End If

    Case Else
        args.IsValid = True
        Return
  End Select

  Dim hoursDiff As Integer = endHour - startHour
  If endMinutes < startMinutes Then
    hoursDiff -= 1
  End If

  args.IsValid = hoursDiff >= 2

End Sub

Answer 1

更新2015-02-27~13：40 EDT：将隐藏字段附加到超链接服务器端

我使用的是GridView1，因为我不知道你的gridview的名字。在GridView1 RowDatabound事件中（请注意在格式字符串的末尾添加＆＃34;＆amp; hourDiff = {7}＆＃34;以及参数中隐藏字段值的添加列表）：

Protected Sub GridView1_RowDataBound(sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
  If e.Row.RowType = DataControlRowType.DataRow Then
    dim hl as HyperLink = if(e.Row.FindControl("siteId"), Nothing)
    If hl IsNot Nothing then
      hl.NavigateURL = String.Format("Reserve.aspx?id={0}&groupsize={1}" & _
          "&facilityFees={2}&extrahour={3}&depoitAmt={4}&cancelAmt={5}" & _
          "&keydeptAmt={6}&hourDiff={7}",
          DataBinder.Eval("siteId"),
          DataBinder.Eval("capacity"),
          DataBinder.Eval("RentalFeeAmount"),
          DataBinder.Eval("ExtraHourAmount"),
          DataBinder.Eval("DepositAmount"),
          DataBinder.Eval("CancellationAmount"),
          DataBinder.Eval("KeyDepositAmount"),
          hf1.Value )
    End If
  End If
End Sub

问题1：每次编译代码并单击“选择”链接

Gridview中的Select链接将导致回发，因此hourDiff每次都将为0，因为回发将强制重新评估所有js

问题2： 请注意，导致回发的每个控件都将重置您的页面javascript。解决这个问题的一种方法是保存到隐藏字段控件（<asp:HiddenField ID="hf1" runat="server" ClientIDMode="Static"...>）并从中恢复。那么您可以这样访问：$('#hf1').val(3.14);并且在回发之间保留值。

Cookie或本地存储是其他选项

此外，是否有任何理由必须在客户端进行计算？因为重定向到新页面后还有其他问题。请注意，即使重定向到同一页面也不是回发。

更新2015-02-26 14:30 EDT 我无法看到您的搜索代码，因此我将假设无论用户如何选择开始/结束日期/时间，都会有一个搜索按钮导致回发包含四个字段（假设asp:TextBox搜索数据，我会调用它们：StartDate，StartTime，EndDate，EndTime。

搜索按钮将导致回发，这应该使搜索字段可用于后面的代码。

构建2个DateTime变量（S，E）并使用DataDiff（）函数确定您需要的差异。

在你的情况下，它会是这样的：

' At class level define the variable:
Dim hourDiff as DateTime = nothing

' In the gridview databinding event do your calculation
Private Sub GridView1_DataBinding(sender As Object, e As System.EventArgs) Handles GridView1.DataBinding
  Dim S as New DateTime( <replace with relevant parameters> )
  Dim E as New DateTime( <replace with relevant parameters> )

  hourDiff = DataDiff(DateInterval.Hour, S, E)
End Sub

' Then in the row databound event append the difference to the hyperlink
Private Sub GridView1_RowDataBound(sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
  If e.Row.RowType = DataControlRowType.DataRow Then
    dim hl as HyperLink = if(e.Row.FindControl("siteId"), Nothing)
    If hl IsNot Nothing then
      hl.NavigateURL = <build your Hyperlink and Append hourDiff>
    End If
  End If
End Sub

2015-02-26 18：06EDT修订

如果可以，我会更喜欢使用hiddenField的选项解释如何将hf1绑定到hourdiff。

在页面中添加隐藏字段，如下所示：

<asp:HiddenField ID="hf1" runat="server" ClientIDMode="Static">

到js添加：

// define hourDiff
var hourDiff; 

// Using jquery place an object reference to the hidden field into hourDiff
hourDiff = $("#hf1");  

// Do your time calculations and assign results to hourDiff
hourDiff.val( time_calc_results );  

// The above places the results in the hidden field Value property
// which will be available in the code behind as as `hf1.Value` after postback

我花了更多的时间来修复刚发布的代码上的错误。

这是预期的，因为它主要来自内存并且是部分伪代码。

关于您的最新代码，这是否意味着我尝试了javascript 我发布在顶部或使用两者？

意图是可以选择Clientside或Serverside的搜索条件，选择权在您手中。但是你必须小心问题1.你需要一种方法来保持帖子之间的计算。因此，我建议隐藏的领域。

最糟糕的情景：5 +回发 在最糟糕的情况下，您每次用户选择时间和日期时都会回发，因此至少您有5个回发，每个开始和结束日期和时间一个，然后单击搜索。像这样发布使得计算客户端无意义。我希望你理解为什么。理想情况下，在这种情况下，用户在选择“搜索”之前进行了所有选择，然后在服务器端进行计算。

场景2：1回发 在这种情况下，您有js或jQ代码选择器，允许用户选择时间和日期而不回发到服务器。这是收集数据的好方法。

如果是Clientside，您需要确保计算完成并在发回之前存储在隐藏字段中
如果您需要获取Serverside，请在搜索按钮单击事件或Gridview DataBinding事件中执行计算。

在任何一种情况下，您都需要修改Hyperlink href。这个可以完成客户端......也许吧。这取决于，如果您在有机会更新选择链接的href之前导致回发。

对我而言，您似乎在每行中添加了自己的超链接。如果是这样，那么你应该能够在计算hourDiff之后使用位jquery代码修改所有超链接

// Assuming hourDiff is defined as 
var hourDiff = $('#hf1');

... (other stuff)

// and you calc and assign to hourDiff as this:
hourDiff.val( endDate - startDate);

... (maybe more other stuff)

// then you modify your hyperlinks like this
$( "#GridView1 a.js_siteid" ).each( function( i, e ) {
    this.href += "&diff=" + hourDiff.val();
} );

另外，我不明白： Dim E as New DateTime( <replace with relevant parameters> )

与使用Date对象的js代码中的VB相当。有十几种方法来实例化一个，所以我只是留给你选择一个适合你的方法。

将javascript值附加到gridview超链接。我的代码不起作用的任何想法？

1 个答案: