javascript - 访问gridview 控件中的隐藏字段以在javascript 中设置值？

Question

我有一个带有一堆模板列的gridview。其中一列是隐藏列，其值为 0 或 1。如果网格 View 中的一行发生更改，我将值设置为 1，否则我保留默认值 0。

模板字段定义为:

<asp:TemplateField>
      <ItemTemplate>
          <input type="hidden" id="rowIsChanged" runat="server" />
      </ItemTemplate>
 </asp:TemplateField>

我的问题是(没有太多细节)，我有一个字段，我可以在其中调用 javascript 函数并在客户端进行一些验证。在这个函数内部，我希望能够访问这个特定行的隐藏字段(rowIsChanged)并将值设置为 1(在 javascript 中)。这样，当我单击服务器端的“更新”按钮时，我可以确保更新发生，因为我检查了 rowIsChanged==1 的条件。 .

所以我的问题，我现在有这样的效果:

<asp:TemplateField>
  <ItemTemplate>
    <asp:TextBox id="txtMyDate" runat="server" onchange="DoSomeValidation(this)" />
  </ItemTemplate>
<asp:TemplateField>

和javascript:

function DoSomeValidation(myParam)
 {
   //do some validation...

   //here is where I need to access the hidden field 'rowIsChanged' and set the value to "1"
 }

那么如何访问该特定行的 rowIsChanged 字段并将其设置为“1”。

编辑

这里有更多细节:

asp 标记:

<asp:TemplateField HeaderText="Date" SortExpression="LineItemDate">
      <ItemTemplate>
        <ajaxToolkit:CalendarExtender TargetControlID="txtMyDate" ID="CalendarExtender3" runat="server"></ajaxToolkit:CalendarExtender>
        <asp:TextBox ToolTip="Line Item Date"  Width="60px"  ID="txtMyDate" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.MyDate") %>'></asp:TextBox>
      </ItemTemplate>
   </asp:TemplateField> 

问题是当我第一次加载页面并加载网格数据时，系统会自动假定对日期进行了更改(隐藏字段的值为 1)。但是没有进行任何更改，这只是一个初始负载......所以我不知道如何处理这个问题。

在 gridview 的行数据绑定(bind)事件中，我有以下代码片段:

If e.Row.RowType = DataControlRowType.DataRow Then
            Dim hiddenField As HtmlInputHidden = DirectCast(e.Row.FindControl("rowIsChanged"), HtmlInputHidden)

            Dim tLID As TextBox = CType(e.Row.FindControl("txtMyDate"), TextBox)

            tLID.Attributes.Add("onchange", "document.getElementById('" + hiddenField.ClientID + "').value=1")
 ....

因此，我已经发布了 rowdatabound 事件和标记的代码。但是一旦页面加载 否 对字段 txtMyDate 进行的编辑然后我单击页面上的“更新”按钮，这会产生以下效果:

  For Each Row As GridViewRow In Me.gvLineItems.Rows
            Dim hiddenField As HtmlInputHidden = DirectCast(Row.FindControl("rowIsChanged"), HtmlInputHidden)
            'only update rows that have been edited / update IsDirty=1 :)
            If (hiddenField.Value = "1") Then

每行似乎都具有值 1 ，就好像该行已经更新(调用了 onchange ......)。但这种情况并非如此。这适用于不使用日历控件的任何其他字段。例如，如果我评论该行:

tLID.Attributes.Add("onchange", "document.getElementById('" + hiddenField.ClientID + "').value=1")

只需为我的所有其他字段保留 onchange，然后单击“更新”按钮，它会按预期工作(也就是说，如果我更改字段中的值，则隐藏字段的值为 1，如果我不更改值字段的值为 0)。但问题只是这一领域......

编辑 2

只是为了测试我什至试过这个:

Protected Sub gvLineItems_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvLineItems.RowDataBound
        If e.Row.RowType = DataControlRowType.DataRow Then
            'this is used to add a trigger to the <TRIGGERS> tag for the update panel
            'I could not do it in the HTML / ASP code because the button is inside of a gridview control
            Dim hiddenField As HtmlInputHidden = DirectCast(e.Row.FindControl("hdnIsChanged"), HtmlInputHidden)

            'the line item date
            Dim tLID As TextBox = CType(e.Row.FindControl("txtMyDate"), TextBox)

            'just a test...
            tLID.Attributes("onchange") = "helloworld();"

我所做的只是添加一个名为 helloworld() 的 js 函数，如下所示:

 function helloworld()
   {
   alert ("hello world");
   }

我运行我的项目并立即发出 hello world 警报(我在网格中有 2 行，所以它会发出 hello world 两次警报)。这对数据没有任何改变，问题是为什么在没有任何改变的情况下调用 onchange？它必须与它如何从数据库返回的数据中设置日期有关，当它看到这样的标记时被认为是一个 onchange 事件:

<asp:TextBox ToolTip="Line Item Date" ID="txtMyDate" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.MyDate") %>' />

特别是 DataBinder.Eval(Container, "DataItem.MyDate")...
编辑#3 ..可能是原因

@蒂姆

我决定做一个小改动，您在评论中提到您通过为其分配一个值静态填写 txtMyDate(而不是像我一样从数据库中提取值)。所以代替这个:

<asp:TextBox ToolTip="Line Item Date" ID="txtMyDate" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.MyDate") %>'

只是为了咯咯笑，我把它改成这样:

<asp:TextBox ToolTip="Line Item Date"  Width="60px"  ID="txtMyDate" runat="server" Text="1/1/2011">

那就是我像你一样静态设置值...我运行我的项目，现在警报没有触发，因此没有 onchange ，这可能就是您无法重现该错误的原因。所以看起来是这样的:

<asp:TextBox ToolTip="Line Item Date" ID="txtMyDate" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.MyDate") %>'

导致 onchange触发事件，这对我来说不好:(...所以问题是如何处理这个？？

编辑4!!!

哇，抱歉所有的编辑，我试图消除这里的可能性......
所以现在我所做的是删除这一行:
<ajaxToolkit:CalendarExtender TargetControlID="txtMyDate" ID="CalendarExtender3" runat="server"></ajaxToolkit:CalendarExtender>
这意味着我从标记中删除了 calendarextender，并且 onchange 事件不再在 load 事件上触发。为什么会导致这种情况发生。即使我离开这个:
<asp:TextBox ToolTip="Line Item Date" ID="txtMyDate" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.MyDate") %>'>
只要我消除了日历扩展器，它就可以正常工作...我是否提到此网格 View 位于更新面板中？会不会是这个问题？？问题是我不想删除日历扩展器......我希望能够允许用户从中选择一个日期，而不是输入它。

Answer 1

您可以从代码隐藏添加 javascript onchange 处理程序:

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
    If e.Row.RowType = DataControlRowType.DataRow Then
        Dim hidden = DirectCast(e.Row.FindControl("rowIsChanged"), HtmlInputHidden)
        Dim txtMyDate = DirectCast(e.Row.FindControl("txtMyDate"), TextBox)
        txtMyDate.Attributes("onchange") = "DoSomeValidation(this,'" & hidden.ClientID & "');"
    End If
End Sub

C#

protected void GridView1_RowDataBound(object sender, System.Web.UI.WebControls.GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow) {
        var hidden = (HtmlInputHidden)e.Row.FindControl("rowIsChanged");
        var txtMyDate = (TextBox)e.Row.FindControl("txtMyDate");
        txtMyDate.Attributes("onchange") = "DoSomeValidation(this,'" + hidden.ClientID + "');";
    }
}

编辑 :这是 js 函数，它可以设置值并在回发后读取它:

 <script type="text/javascript">
     function DoSomeValidation(ctrl, hiddenID) {
        var hidden = document.getElementById(hiddenID);
        if(ctrl.defaultValue != ctrl.value)
            hidden.value = "1";
     }
 </script>

编辑2 : 添加了一个额外的检查当前文本框的值和它的 defaultValue 之间的差异.