¿Enviar JSON a webmethod?

Question

¿Cómo puedo enviar un objeto JSON a un método web usando jQuery?

Answer 1

Por favor, consulte el artículo this de Dave Ward. Es un tutorial completo sobre cómo hacer esto. También encontrarás allí otras cosas geniales de jquery/ASP.net.

EDIT: - de Dave está llamando método sin argumentos, se puede reemplazar vacío datos propiedad con datos reales que desea enviar:

$.ajax({ 
    type: "POST", 
    url: "Default.aspx/GetDate", 
    data: "{'name':'tiger1','hobbies':['reading','music']}",//PUT DATA HERE 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 

Answer 2

Se necesitaría para publicar usando Ajax y aceptar la cadena entrante en el webmethod. Entonces necesitaría usar el deserializador de JavaScript para convertirlo en un objeto del lado del servidor.

Answer 3

webMethods esperan que contiene JSON cadena que se analiza en el lado del servidor, utilizo la función JSON.stringify para convertir un parámetros objeto de cadena, y enviar los datos, tengo una función como esta:

jQuery.executePageMethod = function(location, methodName, methodArguments, 
            onSuccess, onFail) { 
    this.ajax({ 
     type: "POST", 
     url: location + "/" + methodName, 
     data: JSON.stringify(methodArguments), // convert the arguments to string 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function(data, status) { 
      var jsonData = JSON.parse(data.d); 
      onSuccess(jsonData, status); 
     }, 
     fail: onFail 
    }); 
}; 

Le recomiendo que incluya el analizador json2.js en sus páginas, para tener la función JSON.stringify entre navegadores disponibles.

Answer 4

Las soluciones más convenientes que he visto simplifican esto al usar la biblioteca the open-source JSON2.js para analizar y "codificar" datos de objetos complejos.

Estos dos excelentes artículos entrar en detalles:

• Using complex types to make calling services less… complex por Dave Ward.

• JavaScript Arrays via JQuery Ajax to an Asp.Net WebMethod por Chris Brandsma.

El segundo artículo puede ser especialmente relevante para usted, a pesar de que llama a un servicio de método web con la siguiente firma ...

public void SendValues(List<string> list) 

... demuestra cómo utilizar la biblioteca JSON2.js para representar un List<string> en javascript (utilizando jQuery, este ejemplo se toma directamente del segundo artículo):

var list = ["a", "b", "c", "d"]; 
var jsonText = JSON.stringify({ list: list }); 

// The 'list' is posted like this 

$.ajax({ 
    type: "POST", 
    url: "WebService1.asmx/SendValues", 
    data: jsonText, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function() { alert("it worked"); }, 
    failure: function() { alert("Uh oh"); } 
}); 

sólo tiene que utilizar su URL WebMethod en lugar del servicio de Web.

Answer 5

Otra biblioteca que puede usar es jquery-json library. Una vez incluido:

var json = $.toJSON(your_object); 

Answer 6

JSON.stringify sí ayuda, pero:

1. no es multi-navegador echar un vistazo aquí: http://www.sitepoint.com/blogs/2009/08/19/javascript-json-serialization/#

2. para el navegador incorporado funciones - todos los navegadores tendrá sus problemas. Si utiliza la serialización por encima Tendrá que:

   • eliminar los saltos de línea con la expresión regular en cadenas
   • cuidar aproximadamente "en cadenas

Answer 7

Código de ejemplo está aquí:

var dataString = JSON.stringify({ 
          contractName: contractName, 
          contractNumber: contractNumber 
         }); 

         $.ajax({ 
          type: "POST", 
          url: "CreateQuote.aspx/GetCallHistory", 
          data: dataString, 
          contentType: "application/json; charset=utf-8", 
          dataType: "json", 
          success: function (result) { 
           alert(result.CallHistoryDescription); 
            OpenLightBox('divDelete'); 

          } 
         }); 


     [System.Web.Services.WebMethod] 
     public static object GetCallHistory(string contractName, string contractNumber) 
     { 
      return new 
      { 
       CallHistoryDescription = "Nalan" 
      }; 

     }