Programar botón en GridView C# mediante jquery ajax

Question

Hola a todos, necesito programar un botón de mi GridView del lado del cliente que abre una ventana modal. Actualmente lo tengo programado del lado del servidor y al hacer click para mostrar la ventana, me recarga la página, y quiero evitar esto.

Parte de mi GridView:

aspx:

        <div>
            <asp:GridView ID="gvConsultaReclamo" runat="server" CssClass="mGrid" AutoGenerateColumns="false" AlternatingRowStyle-BackColor="#E8F0FE"
                AllowPaging="True" PageSize="5" AllowCustomPaging="False" PagerSettings-Mode="Numeric" PagerSettings-PageButtonCount="3"
                OnPageIndexChanging="gvConsultaReclamo_PageIndexChanging" PagerStyle-Font-Italic="true">
                <Columns>
                    <asp:TemplateField HeaderStyle-ForeColor="White">
                        <ItemTemplate>
                            <button runat="server" id="btnVer" class="btn btn-primary btn-block btnSecundario" style="color: black" onserverclick="btnVer_Click" title="Ver detalles">
                                <i class="fa fa-fw fa-eye"></i>
                            </button>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="rec_IDReclamo" Visible="false" />
                    <asp:BoundField DataField="rec_codigo" HeaderText="Código" />
                    <asp:BoundField DataField="rec_fechaAlta" HeaderText="Fecha Alta" DataFormatString="{0:dd/MM/yyyy}" />
                    <asp:BoundField DataField="arServ_nombre" HeaderText="Área Servicio" />
                    <asp:BoundField DataField="tipRec_nombre" HeaderText="Tipo de Reclamo" />
                    <asp:BoundField DataField="rec_direccion" HeaderText="Dirección" />
                    <asp:BoundField DataField="bar_nombre" HeaderText="Barrio" />
                    <asp:BoundField DataField="estRec_nombre" HeaderText="Estado" />
                </Columns>
            </asp:GridView>
        </div>

aspx.cs:

protected void btnVer_Click(object sender, EventArgs e)
    {
        clsHistorial objClsHistorial;
        List<clsHistorial.DatosHistorial> lstHistorial;

        try
        {
            var btnVer = (Control)sender;
            GridViewRow fila = (GridViewRow)btnVer.NamingContainer;

            long CodRec = Convert.ToInt64(fila.Cells[2].Text);

            objClsHistorial = new clsHistorial();
            lstHistorial = objClsHistorial.SelectHistorial(CodRec);

            if (lstHistorial.Count != 0)
            {
                gvModal.DataSource = lstHistorial;
                gvModal.DataBind();

                lblTipRec.Text = " " + fila.Cells[5].Text;
                ScriptManager.RegisterStartupScript(Page, Page.GetType(), "myModal", "openModal();", true);
            }
        }
        catch (Exception ex)
        {
            ex.Message.ToString();
        }
    }

Esto mismo que estoy haciendo aquí, intento hacerlo mediante jquery ajax, pero no se de que forma hacerlo:

    <script type="text/javascript">
        $(function () {
            $("[id$=gvConsultaReclamo]").find("[id$=btnVer]").bind("click", function () {

                var row = $(this).closest("tr");
                var codigo = row.find("td").eq(2).html();

                $.ajax({
                    type: "POST",
                    url: "http://digitalclaim.somee.com/DCWebService.asmx/SelectHistorial",
                    data: { codRec: codigo },
                    contentType: "application/json",
                    dataType: "json",

                    success: function (response) {
                        
                    },
                    error: function (msg) {
                        alert(msg);
                    }
                });
            });
        });
    </script>

¿Voy por el camino correcto? ¿Como debería programar la parte del success? 

Agradecería mucho de su ayuda. Gracias por su atención!

Saludos

Answer 1

Hola  


Gracias por levantar tu consulta en los foros de MSDN. Con respecto a la misma, te hago la recomendación de ingresar al siguiente enlace en donde puedes encontrar una posible solución para tu problema.

https://social.msdn.microsoft.com/Forums/es-ES/0994d27e-1d71-485a-8f97-b727b2983ff3/boton-cargando-en-c-y-ajax?forum=vcses

https://social.msdn.microsoft.com/Forums/es-ES/9df3650c-d753-483c-aa53-64fe7f28760b/actualizar-un-gridview-mediante-un-boton?forum=netfxwebes

Gracias por usar los foros de MSDN.


Carlos Ruiz
 ____


Por favor recuerde "Marcar como respuesta" las respuestas que hayan resuelto su problema, es una forma común de reconocer a aquellos que han ayudado, y hace que sea más fácil para los otros visitantes encontrar la solución más tarde. 


Microsoft ofrece este servicio de forma gratuita, con la finalidad de ayudar a los usuarios y la ampliación de la base de datos de conocimientos relacionados con los productos y tecnologías de Microsoft.  


Este contenido es proporcionado "tal cual" y no implica ninguna responsabilidad de parte de Microsoft.

Answer 2

hola

depende como vayas a implementar el modal

[ASP.NET] PopUp Edición - Usando Jquery UI Dialog

si invocas un servicio que retorna datos como json vas a tener que asignar estos a los controles del html del popup

pero el codigo del btnVer_Click no sirve para nada, el popup deberias abrirlo directo desde codigo cliente

saludos

---

Leandro Tuttini

Blog
MVP Profile
Buenos Aires
Argentina

Answer 3

Hola 

Debido a que no hemos recibido alguna notificación que aún se esté presentando el problema que enuncias en tu consulta  y que la respuesta provista provee un amplio panorama y campo de acción sobre tu duda; vamos a considerar tu duda como resuelta debido a la respuesta apropiada proporcionada  y así proceder a calificar las misma como respuesta.

No dudes en ampliar más sobre este tema si es que aún lo requirieras o de abrir una nueva consulta en caso de tener alguna situación o necesitarla con algún otro de los productos de Microsoft.

Gracias por usar los foros de MSDN.

Carlos Ruiz

 ____

Por favor recuerde "Marcar como respuesta" las respuestas que hayan resuelto su problema, es una forma común de reconocer a aquellos que han ayudado, y hace que sea más fácil para los otros visitantes encontrar la solución más tarde. 

Microsoft ofrece este servicio de forma gratuita, con la finalidad de ayudar a los usuarios y la ampliación de la base de datos de conocimientos relacionados con los productos y tecnologías de Microsoft. 

Este contenido es proporcionado "tal cual" y no implica ninguna responsabilidad de parte de Microsoft.