Obtener GridView seleccionado fila DataKey en Javascript

Question

Tengo GridView que puedo seleccionar una fila. Luego tengo un botón encima de la cuadrícula llamado Editar en el que el usuario puede hacer clic para abrir una ventana y editar la fila seleccionada. Por lo tanto, el botón tendrá un código Javascript detrás de él a lo largo de las líneas de

function editRecord()
{
  var gridView = document.getElementById("<%= GridView.ClientID %>");
  var id = // somehow get the id here ???
  window.open("edit.aspx?id=" + id);
}

La pregunta es ¿cómo recupero el ID de los registros seleccionados en javascript?

Answer 1

Lo resolví en base a la respuesta de JasonS. Lo que hice fue crear un campo oculto en la Vista de cuadrícula como este:

<asp:TemplateField ShowHeader="False">
    <ItemTemplate>
      <asp:HiddenField ID="hdID" runat="server" Value='<%# Eval("JobID") %>' />
    </ItemTemplate>
</asp:TemplateField>
<asp:TemplateField Visible="False">
    <ItemTemplate>
      <asp:LinkButton ID="lnkSelect" runat="server" CommandName="select" Text="Select" />
    </ItemTemplate>
</asp:TemplateField>

Luego, en OnRowDataBind, tiene un código para configurar la fila seleccionada

protected virtual void Grid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        // Click to highlight row
        Control lnkSelect = e.Row.FindControl("lnkSelect");
        if (lnkSelect != null)
        {
            StringBuilder click = new StringBuilder();
            click.AppendLine(m_View.Page.ClientScript.GetPostBackClientHyperlink(lnkSelect, String.Empty));
            click.AppendLine(String.Format("onGridViewRowSelected('{0}')", e.Row.RowIndex));
            e.Row.Attributes.Add("onclick", click.ToString());
        }
    }            
}

Y luego en el Javascript tengo un código como este

<script type="text/javascript">

var selectedRowIndex = null;

function onGridViewRowSelected(rowIndex)
{        
    selectedRowIndex = rowIndex;
}

function editItem()
{   
    if (selectedRowIndex == null) return;

    var gridView = document.getElementById('<%= GridView1.ClientID %>');                
    var cell = gridView.rows[parseInt(selectedRowIndex)+1].cells[0];        
    var hidID = cell.childNodes[0];        
    window.open('JobTypeEdit.aspx?id=' + hidID.value);
}

</script> 

Funciona a tratar :-)

Answer 2

1) cambia tu función javascript para usar un parámetro

function editRecord(clientId)
{ ....

2) genere la llamada en su botón editRecord ... si desea evitar tratar con las identificaciones generadas en .net, solo use una simple

<input type="button" onclick="editRecord(your-rows-client-id-goes-here)" />

Answer 3

Basado en sus comentarios a la respuesta de @DaveK, en javascript puede establecer la identificación de un campo oculto en el ID de cliente de la fila seleccionada cuando el usuario lo seleccione. Luego haga que su función editRecord use el valor establecido en el campo de formulario oculto.

Answer 4

uno podría evitar el javascript por completo, estableciendo etiquetas de anclaje rellenadas previamente con la cadena de consulta para cada fila (aunque esto afectará su diseño de tabla, solo necesitará un clic en lugar de 2 del usuario)

inserte en la plantilla de gridview:

<asp:HyperLink runat="server" ID="editLink" Target="_blank"
   NavigateURL='<%# Eval("JobID","edit.aspx?id={0}") %>'> 
     Edit..
</asp:HyperLink>