如何使用javascript從gridview的edititem模板字段獲取值

這裏是一個代碼。當我點擊編輯按鈕時，gridview進入編輯模式，更新和取消按鈕可見，項目模板的所有標籤都被更改爲edititem模板的文本框。當我點擊更新按鈕時，我想從使用JavaScript的選定索引文本框中獲取值。如何使用javascript從gridview的edititem模板字段獲取值

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GridViewJavaScript.aspx.cs"  Inherits="GridViewJavaScript.GridViewJavaScript" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<script type="text/javascript"> 
    function gridviewvalidation() { 
     debugger; 
     var gridview = document.getElementById("GridView1"); 
     //var values = gridview.rows[].cells[1].innerText; 
     alert(gridview.rows[selectedindex].cells[1].innerText); 
    } 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
    <div> 

     <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" CellPadding="3" CellSpacing="2" DataKeyNames="roleid" EmptyDataText="There are no data records to display." OnRowEditing="GridView1_RowEditing" OnRowUpdating="GridView1_RowUpdating"> 
      <Columns> 
       <asp:TemplateField HeaderText="roleid" SortExpression="roleid"> 
        <EditItemTemplate> 
         <asp:Label ID="Label1" runat="server" Text='<%# Eval("roleid") %>'></asp:Label> 
        </EditItemTemplate> 
        <ItemTemplate> 
         <asp:Label ID="Label1" runat="server" Text='<%# Bind("roleid") %>'></asp:Label> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="username" SortExpression="username"> 
        <EditItemTemplate> 
         <asp:TextBox ID="TextBox123" runat="server" Text='<%# Bind("username") %>'></asp:TextBox> 
        </EditItemTemplate> 
        <ItemTemplate> 
         <asp:Label ID="Label2" runat="server" Text='<%# Bind("username") %>'></asp:Label> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="password" SortExpression="password"> 
        <EditItemTemplate> 
         <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("password") %>'></asp:TextBox> 
        </EditItemTemplate> 
        <ItemTemplate> 
         <asp:Label ID="Label3" runat="server" Text='<%# Bind("password") %>'></asp:Label> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="role" SortExpression="role"> 
        <EditItemTemplate> 
         <asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("role") %>'></asp:TextBox> 
        </EditItemTemplate> 
        <ItemTemplate> 
         <asp:Label ID="Label4" runat="server" Text='<%# Bind("role") %>'></asp:Label> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="Action"> 
        <EditItemTemplate> 
         <asp:LinkButton ID="btnupdate" runat="server" CommandName="Update" OnClientClick="return gridviewvalidation()">Update</asp:LinkButton> 
         &nbsp; 
        <asp:LinkButton ID="btncancel" runat="server" CommandName="cancel">Cancel</asp:LinkButton> 
        </EditItemTemplate> 
        <ItemTemplate> 
         <asp:Button ID="btnedit" runat="server" CommandName="Edit" Text="Edit" /> 
        </ItemTemplate> 
       </asp:TemplateField> 
      </Columns> 
      <FooterStyle BackColor="#F7DFB5" ForeColor="#8C4510" /> 
      <HeaderStyle BackColor="#A55129" Font-Bold="True" ForeColor="White" /> 
      <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" /> 
      <RowStyle BackColor="#FFF7E7" ForeColor="#8C4510" /> 
      <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="White" /> 
      <SortedAscendingCellStyle BackColor="#FFF1D4" /> 
      <SortedAscendingHeaderStyle BackColor="#B95C30" /> 
      <SortedDescendingCellStyle BackColor="#F1E5CE" /> 
      <SortedDescendingHeaderStyle BackColor="#93451F" /> 
     </asp:GridView> 

    </div> 
</form>

也試過，但沒有工作：

<script type="text/javascript"> 
    function gridviewvalidation() { 
     debugger; 
     var gridview = document.getElementById("TextBox1"); 
     //var values = gridview.rows[].cells[1].innerText; 
     alert(gridview.value); 
    } 
</script>

下面給出了錯誤：未定義

<script type="text/javascript"> 
    function gridviewvalidation() { 
     debugger; 
     var gridview = document.getElementById("GridView1"); 
     //var values = gridview.rows[].cells[1].innerText; 
     // alert(gridview.rows[selectedindex].cells[1].innerText); 
     var txtvalue = gridview.getElementsByTagName("TextBox1"); 
     alert(txtvalue.value); 
    } 
</script>

來源

2013-08-24 Arshad Nazeer

<script type="text/javascript"> 
    function gridviewvalidation(lnk) { 
     debugger; 
     var row = lnk.parentNode.parentNode; 
     var rowIndex = row.rowIndex - 1; 
     var gridview = document.getElementById("GridView1_TextBox1_"+rowIndex); 
     alert(gridview.value); 
    } 
</script>

注：「GridView1_TextBox1_0 「是我從頁面源獲得的ID。

來源

2013-08-25 01:53:28

您可以使用「檢查元素」瀏覽器功能獲取DOM值。那，或者你可以通過使用GridView1.ClientID獲得對象的ID;您可以交換此屬性而不是hardcoding getElementByID（「hardcodedValue」） – Futureproof

如何使用javascript從gridview的edititem模板字段獲取值

回答

相關問題