使用JavaScript获取网格视图隐藏字段值/ jquery

Question

原谅我的英语，我在我的项目中遇到了一个挑战我每当我开始访问使用JavaScript或Jquery的网格视图中的隐藏字段值时，我都会收到编译错误像hidden field doesn't exist in current context那么我怎样才能访问隐藏的字段值？

SelectPatientInfo.aspx

<asp:Content ID="Content2" ContentPlaceHolderID="cphContent" runat="Server"> 
    <script type="text/javascript"> 
     function DispValue(sender, e) { 
      var id = e.get_value(); 
      document.getElementById("<%=PatientRefferalId.ClientID%>").value=id; //getting error here 
     } 
    </script> 

    <div align="left" style="float: left; margin-left: 5px;"> 
     <asp:GridView ID="gvPatient" runat="server" AutoGenerateColumns="false" EnableViewState="true"> 
      <Columns> 
       <asp:TemplateField HeaderStyle-Font-Bold="true" HeaderStyle-Font-Size="12px" HeaderStyle-Height="20px"> 
        <HeaderTemplate>&nbsp;Patient Name&nbsp;</HeaderTemplate> 
        <ItemTemplate> 
         <asp:HiddenField ID="PatientRefferalId" runat="server" Value="0" /> 
         <PUC:PatientUserControl ID="pucPatient1" runat="server" OnClientSelect="DispValue" PTStatusShow="0"/> 
        </ItemTemplate> 
       </asp:TemplateField> 
      </Columns> 
     </asp:GridView> 
    </div> 
</asp:Content> 

SelectPatientInfo.aspx.cs

protected void Page_Load(object sender, EventArgs e) { 
    try { 
     if (!IsPostBack) { 
      dt = new DataTable(); 
      dt.Columns.Add("col1"); 
      dt.Columns.Add("col2"); 
      dt = AddRow(dt); 
      gvPatient.DataSource = dt; 
      gvPatient.DataBind(); 
     } 
    } catch (Exception ex) { 

    } 
} 

private DataTable AddRow(DataTable dt) { 
    for (int i = 0; i < 5; i++) { 
     DataRow dr = dt.NewRow(); 
     dr[0] = ""; 
     dr[1] = ""; dt.Rows.Add(dr); 
    } 
    return dt; 
} 

protected void GridPatient_DataBound(object sender, EventArgs e) { 
    try { 
     foreach (GridViewRow item in gvPatient.Rows) { 
      HiddenField hfReferralId = (HiddenField)item.FindControl("PatientRefferalId"); 
      Response.write(hfReferralId.Value); 
     } 
    } catch (Exception ex) { 

    } 
} 

Answer 1

我不知道该代码

document.getElementById("<%=PatientRefferalId.ClientID%>") 

会的工作，因为你不只有o ne“PatientRefferalId”，但是会得到很多（与gridview中的行数一样多）。

我不知道是否有一个更清洁的方式，但我可以用这段JavaScript代码

var gv = document.getElementById("<%=gvPatient.ClientID%>"); 
var Rows = gv.getElementsByTagName("tr"); // Get all the rows from your gridview (rendered as html table). 
// you can loop through the rows or if you know the row index, you can do: 
alert(Rows[2].childNodes[0].children[0].value); // Show you the first control (the hiddenfield) of the first cell of the row #2. 

Answer 2

嗨这篇文章可以帮助你做你想做的。

var c = document.getElementsByTagName("table"); 
    for (var i = 0; i < c.length; i++) { 
     if (c[i].id.indexOf("GridView1") > -1) { 
      var hidd = c[i].getElementsByTagName("input"); 
      for (var j = 0; j < hidd.length; j++) { 
       if (hidd[j].type == "hidden") 
        alert(hidd[j].id); 
      } 
     } 
    } 

并请一并参考以下链接..它的工作对我来说..

http://forums.asp.net/p/1510265/3603566.aspx/1?Re+how+to+find+gridview+hidden+label+value+from+javascript

Answer 3

<asp:Content ID="Content2" ContentPlaceHolderID="cphContent" runat="Server"> 
     <script type="text/javascript"> 
      function DispValue(btnShow) { 
    var parentRow = $(btnShow).closest("tr"); 
var hiddenField=parentRow.find('input[id$=PatientRefferalId]'); 
alert(hiddenField.val()); 

    return false; 
      } 
     </script> 

     <div align="left" style="float: left; margin-left: 5px;"> 
      <asp:GridView ID="gvPatient" runat="server" AutoGenerateColumns="false" EnableViewState="true"> 
       <Columns> 
        <asp:TemplateField HeaderStyle-Font-Bold="true" HeaderStyle-Font-Size="12px" HeaderStyle-Height="20px"> 
         <HeaderTemplate>&nbsp;Patient Name&nbsp;</HeaderTemplate> 
         <ItemTemplate> 
          <asp:HiddenField ID="PatientRefferalId" runat="server" Value="0" /> 

    <asp:LinkButton ID="lnkPopUp" runat="server" Style="font-size: 16px;" OnClientClick="return DispValue(this)" Text="PopUp" 
                 ></asp:LinkButton> 

         </ItemTemplate> 
        </asp:TemplateField> 
       </Columns> 
      </asp:GridView> 
     </div> 
    </asp:Content>