restful - Llamar a un método del lado del servidor ASP.NET a través de jQuery

jquery consume rest service example

Question

Intento llamar a un método del lado del servidor desde el lado del cliente a través de jQuery. Mi código es el siguiente:

Lado del servidor:

    using System.Web.Services;
    [WebMethod()]
    //[ScriptMethod()]
    public static void SendMessage(string subject, string message, string messageId, string pupilId)
    {
        //Send message
    }

Lado del cliente:

$("#btnSendMessage").live("click", function(){
  var subject = $("#tbSubject").val();
  var message = $("#tbMessage").val();
  var messageId = $("#hdnMessageId").val();
  var pupilId = $("#hdnPupilId").val();

  $.ajax({
      type: "POST",
      url: "./MessagePopup.aspx/SendMessage",
      data: ("subject=" + subject + "&message=" + message + "&messageId=" + messageId + "&pupilId=" + pupilId),
      error: function(XMLHttpRequest, textStatus, errorThrown){
          alert(textStatus);
      },
      success: function(result){
         alert("success");
      }
   });
   return false;
});

He agregado un punto de interrupción en el método SendMessage del lado del servidor, pero nunca lo estoy ejecutando, pero cuando ejecuto el código, se llama al método de éxito de jQuery. ¿Qué podría estar causando esto?

Answer 1

Aquí hay un código que podría funcionar en su situación.

<script type="text/javascript">
    $(document).ready(function () {

        // Add the page method call as an onclick handler for the button.
        $("#btnSubmit").click(function () {

            //get the string from the textbox
            $.ajax({

                type: "POST",
                url: "testSearch.aspx/GetMyShippingDate",
                contentType: "application/json; charset=utf-8",
                data: "{''tracking_num'': ''" + $("#txtTrackingNumber").val() + "''}",  
                dataType: "json",
                success: function (date) {

                    // Replace the div''s content with the page method''s return.
                    Success(date);

                },
                error: Failed
            });
        });
    });

     function Success(result) {  
          $("#ParcelShippingDate").html(result.d);
      }  
      function Failed(result) {  
          alert(result.status + " " + result.statusText);  
      }  

Hay un ejemplo que siempre me ha funcionado.

Aquí está el artículo completo http://www.webdeveloperpost.com/Articles/How-to-use-jquery-ajax-in-asp-dot-net-web-page.aspx

Funciona bien para aquellos que quieren una manera directa de utilizar el método jquery asp.net volver a llamar

Answer 2

Debe usar el servicio web en lugar de la página web regular de aspx. Las páginas web no tienen soporte para llamar a los métodos web, creo que su solicitud de jQuery carga la página HTML. Te sugiero dos cosas:

1. Utilice Fiddler2 (con IE) o HttpFox (con Firefox) para depurar las solicitudes y respuestas AJAX en el lado del cliente.
2. Use el servicio web WCF en el lado del servidor. en este caso, puede usar SvcConfigEditor y SvcTraceViewer para configurar y depurar métodos web en el lado del servidor.

Answer 3

Para llamar a ASP.NET AJAX "ScriptServices" y métodos de página, debe usar la sintaxis completa de $ .ajax ():

$.ajax({
  type: "POST",
  url: "MessagePopup.aspx/SendMessage",
  data: "{subject:''" + subject + "'',message:''" + message + ",messageId:''" + messageId + "'',pupilId:''" + pupilId +"''}",
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function(msg) {
    // Do something interesting here.
  }
});

Consulte esta publicación para obtener detalles sobre por qué es necesario: http://encosia.com/2008/05/29/using-jquery-to-directly-call-aspnet-ajax-page-methods/

Editar: La extensión no cambia a .asmx sino que permanece como .aspx.

Answer 4

Parece que estás intentando utilizar un método de página.

Mire aquí Métodos de página en ASP.NET Ajax para ayuda

Answer 5

$.ajax({  
        type: "POST",  
        url: "MessagePopup.aspx/SendMessage",  
        data: "{subject:''" + subject + "'',message:''" + message + ",messageId:''" + messageId + "'',pupilId:''" + pupilId +"''}",  
        async: true,  
        cache: false,  
        contentType: "application/json; charset=utf-8",  
        dataType: "json",  
        success: function() {},  
        error:function (xhr, ajaxOptions, thrownError){ alert(thrownError); }  
     });

Si esto no funciona ... y da "Error de sintaxis: error de sintaxis" ... luego agrega esto

<httpHandlers>
            <remove verb="*" path="*.asmx"/>
            <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory,
System.Web.Extensions, Version=3.5.0.0, Culture=neutral,
PublicKeyToken=31BF3856AD364E35"/>
            <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory,
System.Web.Extensions, Version=3.5.0.0, Culture=neutral,
PublicKeyToken=31BF3856AD364E35"/>
            <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler,
System.Web.Extensions, Version=3.5.0.0, Culture=neutral,
PublicKeyToken=31BF3856AD364E35" validate="false"/>
        </httpHandlers>
        <httpModules>
            <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions,
Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        </httpModules>

entre </compilation> y </system.web> en su archivo Web.Config.

Espero que esto ayude a alguien porque me tomó un tiempo darme cuenta de que además de la función jquery, tengo que agregar eso en Web.Config.