Frustré par la réponse de Json

Question

Alors voici mon problème. J'utilise $ .ajax de Jquery pour renvoyer une série de valeurs à une méthode web. La méthode web prend les valeurs, crée un objet, puis le renvoie en tant que json à la page appelante. Une fois que je reçois la réponse, je ne peux pas accéder à la réponse et afficher ses valeurs. Est-ce que quelqu'un peut expliquer ce que je dois faire pour que cela fonctionne?

Le script jquery:

$(document).ready(function() { 
    $("#create").click(function() { 
     var name = $('#name').val(); 
     var company = $('#company').val(); 
     var location = $('#location').val(); 
     var phonenumber = $('#phonenumber').val(); 
     var country = $('#country').val(); 

     $.ajax({ 
      type: "POST", 
      url: "WebService.asmx/MakeEmployee", 
      data: "{name:'" + name + 
          "',company:'" + company + 
          "',location:'" + location + 
          "',phonenumber:'" + phonenumber + 
          "',country:'" + country + 
          "'}", 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function(msg) { 
       AjaxSucceeded(msg.d); 
      } 
     }); 
    }); 

    function AjaxSucceeded(data) { 
     //var item = jQuery.parseJSON(data) // this doesn't work for me. 
     $("#response").html(
      "<ul><li> " + data.Name + 
      "</li><li> " + data.Company + 
      "</li><li> " + data.Address + 
      "</li><li> " + data.Phone + 
      "</li><li> " + data.Country + 
      "</ul> " 
      ); 
     }; 
    }); 

La méthode web:

[WebMethod] 
[ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
public string MakeEmployee(string name, string company, 
       string location, string phoneNumber, string country) 
{ 
    Employee e = new Employee(name, company, location, phoneNumber, country); 
    return new JavaScriptSerializer().Serialize(e); 
} 

Et la réponse que je revenir:

{"d":"\"Name\":\"bob\", 
      \"Company\":\"google\", 
      \"Address\":\"home\", 
      \"Phone\":\"123\", 
      \"Country\":\"usa\"}"} 

C'est ce que je pense que je devrais être de retour:

{"Name":"bob", 
    "Company":"google", 
     "Address":"home", 
     "Phone":"123", 
     "Country":"usa"} 

L'erreur que je reçois une fois que les pages Renders à nouveau est la suivante:

•undefined 
•undefined 
•undefined 
•undefined 
•undefined 

Answer 1

Votre réponse sera déjà analysée comme JSON, il est donc déjà un objet ... pas besoin de l'analyser à nouveau il suffit d'utiliser directement , comme ceci:

function AjaxSucceeded(data) { 
    $("#response").html(
     "<ul><li> " + data.Name + 
     "</li><li> " + data.Company + 
     "</li><li> " + data.Address + 
     "</li><li> " + data.Phone + 
     "</li><li> " + data.Country + 
     "</ul> " 
    ); 
} 

L'emballage { d: ... } est ajouté par ASP.Net, c'est un comportement normal. Après que votre question est l'élément pas retourné correctement, vous devez renvoyer un objet pas une chaîne de ASP.Net, de préférence ceci:

[WebMethod, ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
public Employee MakeEmployee(string name, string company, 
    string location, string phoneNumber, string country) { 
    return new Employee(name, company, location, phoneNumber, country); 
} 

... où Employee a les propriétés que vous voulez sur le côté JavaScript. Laissez ASP.Net gérer la sérialisation ici au lieu de le faire directement, vous obtiendrez une réponse plus nette dans l'ensemble.

Answer 2

Commencez par nettoyer votre méthode de maintenance. Vous n'avez vraiment pas besoin de ce constructeur et de toutes ces propriétés. Vous avez déjà un type Employee, afin de l'utiliser:

[WebMethod] 
[ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
public Employee MakeEmployee(Employee e) 
{ 
    // Maybe do something more useful here with this employee 
    // like raise his salary 
    return e; 
} 

Et puis nettoyer votre javascript:

$.ajax({ 
    type: 'POST', 
    url: 'WebService.asmx/MakeEmployee', 
    data: JSON.stringify({ 
     // All those correspond to Employee properties you would like to pass 
     Name: $('#name').val(), 
     Company: $('#company').val(), 
     Location: $('#location').val(), 
     PhoneNumber: $('#phonenumber').val(), 
     Country: $('#country').val() 
    }), 
    contentType: 'application/json; charset=utf-8', 
    dataType: 'json', 
    success: function(msg) { 
     // msg.d is gonna be the returned employee 
     AjaxSucceeded(msg.d); 
    } 
}); 

Answer 3

Essayez d'utiliser cette fonction pour ajax initaliazer ajax asp.net. Il définit la plupart des paramètres par défaut, vous n'avez donc qu'à fournir l'URL/les paramètres Appelez d'abord votre fonction document.ready(), puis vos appels.

function jqueryInit() { 
$.ajaxSetup({ 
    type: "POST", 
    contentType: "application/json; charset=utf-8", 
    data: "{}", 
    dataFilter: function (data) { 
     var msg; 
     if (typeof (JSON) !== 'undefined' && 
       typeof (JSON.parse) === 'function') 
      msg = JSON.parse(data); 
     else 
      msg = eval('(' + data + ')'); 

     if (msg.hasOwnProperty('d')) 
      return msg.d; 
     else 
      return msg; 
    } 
}); 

}