How to get Ajax request data using jQuery?

Question

I have an Ajax request:

$.ajax({ url: "MyPage.aspx", 
    data: params,
    success: function(data) {
        // Check results                
        $('#testp').append(data.message);
        enableForm();
    },
    error: function() {
        alert('Unable to load the permissions for this user level.\n\nYour login may have expired.');
        enableForm();
    },
    dataType: "json"
});

The request page has C # code that does this at the end of Page_Load:

Response.AppendHeader("X-JSON", result);

'result' is formatted as follows:

{ "success": true, "message": "SUCCESS", "user_level": 25, "switches": [ { "number": 30, "is_enabled": false, "is_default": false }, { "number": 30, "is_enabled": false, "is_default": false } ]}

The request returns successfully, but 'data' is null. What am I missing?

Thank.

Answer 1

The main problem is that you are returning JSON data in the HTTP header, and not as the content of the response. You probably want to do something like this:

Response.ContentType = "application/json";
Response.Write(result);
Response.End();

, ASPX-. , Page_Load, , , - JSON. , JSON .

JSON , ASP.NET AJAX " ", . :

public class PermissionsResult
{
  public bool success;
  public string message;
  public int user_level;

  public List<Switch> switches;
}

public class Switch
{
  public int number;
  public bool is_enabled;
  public bool is_default;
}

// The combination of a WebMethod attribute and public-static declaration
//  causes the framework to create a lightweight endpoint for this method that
//  exists outside of the normal Page lifecycle for the ASPX page.
[WebMethod]
public static PermissionsResult GetPermissions(int UserLevel)
{
  PermissionsResult result = new PermissionsResult();

  // Your current business logic to populate this permissions data.
  result = YourBusinessLogic.GetPermissionsByLevel(UserLevel);

  // The framework will automatically JSON serialize this for you.
  return result;
}

, , , . , , .

ASP.NET AJAX jQuery, $.ajax() :

$.ajax({
  // These first two parameters are required by the framework.
  type: 'POST',
  contentType: 'application/json',
  // This is less important. It tells jQuery how to interpret the
  //  response. Later versions of jQuery usually detect this anyway.
  dataType: 'json',
  url: 'MyPage.aspx/GetPermissions',
  // The data parameter needs to be a JSON string. In older browsers,
  //  use json2.js to add JSON.stringify() to them.
  data: JSON.stringify({ UserLevel: 1}),
  // Alternatively, you could build the string by hand. It messy and
  //  error-prone though:
  data: "{'UserLevel':" + $('#UserLevel').val() + "}",
  success: function(data) {
    // The result comes back wrapped in a top-level .d object, 
    //  for security reasons (see below for link).
    $('#testp').append(data.d.message);
  }
});

, : http://encosia.com/2010/05/31/asmx-scriptservice-mistake-invalid-json-primitive/

, JSON.stringify(): http://encosia.com/2009/04/07/using-complex-types-to-make-calling-services-less-complex/

.d - , . , JSON , :

{"d": { "success": true, "message": "SUCCESS", "user_level": 25, "switches": [ { "number": 30, "is_enabled": false, "is_default": false }, { "number": 30, "is_enabled": false, "is_default": false } ]}}

, . , , . , , . : http://encosia.com/2009/02/10/a-breaking-change-between-versions-of-aspnet-ajax/

Answer 2

:

URL- ajax:

url: "MyPage.aspx/method"

, , WebMethod().

---

$. ajax . , AJAX , , :

success: function (data) { 
    //do something 
}

"data.message" , "" . "testp" "data.message", .

, AJAX .Net: http://encosia.com/

JSON lib (http://www.json.org/js.html), , .

alert(JSON.stringify(data));

Answer 3

, , , !

jQuery Ajax - JSON