Разочарован ответом Json

Question

Итак, вот моя проблема.Я использую $ .ajax Jquery для передачи ряда значений в веб-метод.Веб-метод принимает значения, создает объект и затем отправляет его обратно как json на вызывающую страницу.После получения ответа я не могу получить доступ к ответу и отобразить его значения.

Может кто-нибудь объяснить, что мне нужно сделать, чтобы эта работа работала?

Сценарий 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> "
            );
        };
  });

Веб-метод:

[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);
}

И ответ, который я получаю:

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

Это то, что, я думаю, я должен получить обратно:

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

Ошибка, которую я получаю после повторного рендеринга страниц, такова:

•undefined
•undefined
•undefined
•undefined
•undefined

Answer 1

Ваш ответ уже будет проанализирован как JSON, поэтому он уже является объектом ... нет необходимости анализировать его снова, просто используйте его напрямую, например:

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> "
    );
}

Оболочка { d: ... } добавлена ​​ASP.Net, это нормальное поведение. После этого ваша проблема заключается в том, что элемент возвращен неправильно, вам нужно вернуть объект , а не строку из ASP.Net, предпочтительно это:

[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);
}

... где Employee имеет свойства, которые вы хотите на стороне JavaScript. Позвольте ASP.Net обрабатывать сериализацию здесь, вместо того, чтобы делать это напрямую, вы получите более четкий ответ в целом.

Answer 2

Попробуйте использовать эту функцию инициализации ajax для asp.net ajax. Он устанавливает большинство значений по умолчанию, поэтому вам нужно только указать URL / параметры Просто сначала вызовите функцию document.ready (), а затем вызовы.

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;
    }
});

}

Answer 3

Начните с очистки вашего метода обслуживания. Вам действительно не нужен этот конструктор и все эти свойства. У вас уже есть тип Employee, поэтому используйте его:

[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;
}

А затем почистите свой 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);
    }
});