synthroid taking instructions

Inicio > Programación Web > Invocar un método C# usando jQuery desde el lado del cliente

Invocar un método C# usando jQuery desde el lado del cliente

Domingo, 12 de Marzo de 2017 Dejar un comentario Ir a comentarios

Este código te ayudara cuando es necesario definir un método code-behind y deseas invocar a ese método desde el lado del cliente. jQuery me ha hecho simple la vida y existe una manera muy fácil de hacer esto.

Antes, sabíamos que una manera era añadir nuestro método como un WebMethod, si queriamos invocar a un método code-behind desde el lado del cliente. Usando esta nueva manera, podemos hacerlo sin invocar a nuestro método en un WebMethod.

En este ejemplo, estoy escribiendo un método para eliminar un usuario en particular cuando se presiona la tecla Supr. No quiero un postback, así que quiero que el evento se ejecute en el lado del cliente. Escribi el método Delete en el lado del servidor dentro del archivo CS y lo invoco desde el lado del cliente usando jQuery. El nombre de mi página es Test.aspx.


Este es mi método en el archivo CS con el nombre DeleteRec().

private void DeleteRec()
{
    int ID= Request.Form["ID"].ToString().ToInteger(); 
    //parameter send from client side
    int UserID = Request.Form["UserID "].ToString().ToInteger();
    //parameter send from client side
    UserBO lObjUserBO = new UserBO ();
    lObjUserBO .DeleteUser(ID, UserID );
}

Así es como se invoca al método en el evento Page_Load:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        #region Ajax methods
        if (Request.Form["MethodName"] == "DeleteR")
        // same Method Name that we are specifying on client side(DeleteR)
        {
            DeleteRec();// Method defined on the page to delete the record
            return;
        }
        #endregion
    }
}

Esto es lo que tenemos que añadir en el lado del cliente (Test.aspx).

<a id="adelete" href="java<!-- no -->script:void(0);">Delete</a>

Ahora utiliza el siguiente script para invocar al método del lado del servidor cuando se hace clic en el enlace:

$('#adelete').click(function()
{
    var dataToSend={ID:ID,MethodName:'DeleteR',UserID :UserID };
 
    var options =
    {
        url: '<%=ResolveUrl("~/Test.aspx") %>?x=' + new Date().getTime(),
        data: dataToSend,
        dataType: 'JSON',
        type: 'POST',
        success: function (response) {
        window.location.href='<%=ResolveUrl("~/Test1.aspx")%>/'+ID;
        //after success will redirect to new page
    }
}
$.ajax(options);
});

Esperamos que le sea útil, cuando se trata de llamar a un método en el servidor del cliente.

ALTERNATIVA

Crear un servicio web llamado WebMethod.SVC, en el archivo CS agregar el método:

[OperationContract]
        [WebInvoke(Method = "POST")]
        public void DeleteRec(string ID)
        {
            DelUser(Convert.ToInt32(ID));
        }

En el lado del cliente indicar la ruta en invocar al método:

function DeleteMessage() {            
            var ID = $('[id$="hdnUserId"]').val();
            var url = '<%=ResolveUrl("~/WebMethods.svc/DeleteRec")%&  gt;';            
            $.ajax({
                type: "POST",
                url: url,
                contentType: "application/json; charset=utf-8",
                data: '{"ID":"' + ID + '"}',
                dataType: "json",
                success: function (response) {
                    document.location.href = '<%= ResolveUrl("~/Test1.aspx")%>';
                },
                error: function (xhr, ajaxOptions, thrownError) {
                }
            });
        }

Comparte y diviertete:
  • Print
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Yahoo! Buzz
  • Twitter
  • Google Bookmarks
  • BarraPunto
  • Bitacoras.com
  • BlinkList
  • Blogosphere
  • Live
  • Meneame
  • MSN Reporter
  • MySpace
  • RSS
  • Suggest to Techmeme via Twitter
  • Technorati
  • LinkedIn
  • email
  • FriendFeed
  • PDF
  • Reddit
  • Wikio IT
  • Add to favorites
  • blogmarks
  • ab maldonado

    Muchas gracias, es lo que necesitaba ya que queria usar variables de sesion y con los webmethods no se puede, saludos

  • Dacasti5000

    en caso de que fuera un control ascx y no una pagina aspx, no canciona.

  • Jheiron

    una pregunta.
    si mi metodo no recibe parametros como hago para que funcione?

    esto es lo que tengo
     if (Request.Form[“MethodName”] == “addComent”) //asi lo llamo                {                    addComent();                    return;                }

    //este es el metodo
     private void addComent()        {             int idComent = GeneraIdComentario();            TextBox txtComentarista = (TextBox)lvPhotoViewer.Items[0].FindControl(“txtComentarista”);            TextBox txtComentario = (TextBox)lvPhotoViewer.Items[0].FindControl(“txtComentario”);//buscando el control en el listview            using (GaleriaBDEntities contex = new GaleriaBDEntities())            {                if (!string.IsNullOrEmpty(txtComentario.Text))                {                    Comentario coment = new Comentario                    {                        Comentario_Codigo = idComent,                        Comentario_Escribe = !string.IsNullOrEmpty(txtComentarista.Text) ? txtComentarista.Text : “Anónimo”,                        Comentario_Descripcion = txtComentario.Text,                        Foto_Codigo = Convert.ToInt32(Session[“Photoidbylabel”]),//capturo el id de la foto                        Comentario_Fecha = DateTime.Now                    };                    contex.AddToComentario(coment);                    contex.SaveChanges();                }            }        }

    como veras el método recibe parámetros pero se los paso directamente
    y del lado del cliente hago esto

     var dataToSend = {MethodName: ‘addComent’};                    var options =                        {                            url: ”,                            data: dataToSend,                            dataType: ‘JSON’,                            type: ‘POST’,                            success: function(response) {                                //window.location.href = ‘/’ + ID;                                alert(“Comentario agregado”);                                //after success will redirect to new page                            }                        };                        $.ajax(options);
    Comentarios.aspx//es el nombre de la pagina
    si me dieras una mano te lo agradeceria…

  • Pingback: Bitacoras.com()

Top Footer