Uncaught SyntaxError: Unexpected token < in JSON with ASP.Net WebMethod

Question

I'm running into a problem with implementing a jQuery bootgrid into my ASP.Net Webforms application.

I get the following problem on my page load which prevents the bootgrid from loading data:

Uncaught SyntaxError: Unexpected token < in JSON at position 4

    at Function.parse [as parseJSON] ()

        at Object.success (jquery.bootgrid.js:232)

        at fire (jquery-3.1.1.js:3305)

        at Object.fireWith [as resolveWith] (jquery-3.1.1.js:3435)

        at done (jquery-3.1.1.js:9242)

        at XMLHttpRequest.

This is my bootgrid implementation in the JavaScript:

$("#grid").bootgrid({
    ajax: true,
    url: "/Secure/Maintenance/Roles.aspx/GetData",
    rowCount: [10, 50, 75, 100, 200, -1]
})

And then here is my C# WebMethod:

[WebMethod]
public static string GetData()
{
    var results = (from x in EFDB.AspNetRoles
                   select x).AsQueryable();

    return JsonConvert.SerializeObject(results);
}

I've used a LINQ Query to get the data and tried converting it to JSON but I'm not sure if I'm doing it correctly. When I set breakpoints in the GetData method, none of them get reached. So I'm really having trouble debugging this.

Any advice on what I could be doing wrong?

Thanks!

That error means that the response is HTML or XML, not JSON. In this case it's most likely a 404 or 500 error page. Check the responseText of the request in the console to see exactly what the error is — Rory McCrossan, Mar 17 '17 at 08:59
@RoryMcCrossan I've added information to the error. Does that help? — Barry Michael Doyle, Mar 17 '17 at 09:01
@RoryMcCrossan does that mean the problem definitely lies within my `WebMethod`? — Barry Michael Doyle, Mar 17 '17 at 09:11
Not quite - thats the JS error. We need to see the responseText from the server. OPen the console and go to the network tab. Then make your AJAX request. It should appear in the list as red. If you then click it you can use the tabs on the right to check it's response value — Rory McCrossan, Mar 17 '17 at 09:11
Ok, but there should still be an entry that matches the URL your AJAX request is calling, thats the one you need to check — Rory McCrossan, Mar 17 '17 at 09:26
@RoryMcCrossan Can a WebMethod be declared as protected like Barry does? I've never seen that before.. — greenhoorn, Mar 17 '17 at 09:28
@greenhoorn well spotted. I was hoping to get an error message to diagnose the exact problem but that could very well be the issue. — Rory McCrossan, Mar 17 '17 at 09:28
@greenhoorn unfortunately I still receive the same error. I'll update my question though to account for that, — Barry Michael Doyle, Mar 17 '17 at 09:40
Next step would be the suggestion of @RoryMcCrossan. Try to catch the server response and have a look at the status code — greenhoorn, Mar 17 '17 at 09:46
@greenhoorn The Status Code for `http://localhost:55982/Secure/Maintenance/Roles.aspx/GetData` is `200 OK` — Barry Michael Doyle, Mar 17 '17 at 09:48
@BarryMichaelDoyle That's strange. There must be another method called GetData in your Roles.aspx which gets successfully executed. Search for post methods. — greenhoorn, Mar 17 '17 at 09:49
@greenhoorn Nope, I still get the same issue when I rename it to something else. — Barry Michael Doyle, Mar 17 '17 at 09:52
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/138314/discussion-between-greenhoorn-and-barry-michael-doyle). — greenhoorn, Mar 17 '17 at 09:57

score 0 · Answer 1 · answered Mar 17 '17 at 09:21

0

Remove .AsQueryable(), because you are sending this result for serialization.

[WebMethod]
protected static string GetData()
{
    var results = (from x in EFDB.AspNetRoles
                   select new 
                   {
                     Id= x.Id,
                     Name = x.Name
                   });

    return JsonConvert.SerializeObject(results.ToArray());
}

answered Mar 17 '17 at 09:21

Hemant D

192
5

2

This doesn't address the problem at all. The method doesn't even get executed. – greenhoorn Mar 17 '17 at 09:23
Yeah, as @greenhoorn mentioned. My problem is that the method doesn't get executed. – Barry Michael Doyle Mar 17 '17 at 09:24
you already have written you script on your page for initializing grid then it should call the method if it is available at your end – Hemant D Mar 17 '17 at 09:33
@HemantDhake your answer doesn't make a difference, I still have the same problem. – Barry Michael Doyle Mar 17 '17 at 09:35
For you guys i have created fiddle to check weather that url is hitting or not , https://jsfiddle.net/fhp2f0m3/ check the network call on run you will get idea it is executed or not. – Hemant D Mar 17 '17 at 09:35

score 0 · Accepted Answer · answered Mar 18 '17 at 16:07

I ended up creating an Generic Handler to post the data and that worked well. Here's is the full code for the Generic Handler:

public class RolesHandler : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/json";
        context.Response.Write(GetData());
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }

    public string GetData()
    {
        var result = string.Empty;
        var con = new SqlConnection();
        var cmd = new SqlCommand();
        var dt = new DataTable();
        string sSQL = @"SELECT Id, Name
                        FROM dbo.AspNetRoles;";

        try
        {
            using (var connection = THF.Models.SQLConnectionManager.GetConnection())
            {
                using (var command = new SqlCommand(sSQL, connection))
                {
                    connection.Open();
                    command.CommandTimeout = 0;
                    var da = new SqlDataAdapter(command);
                    da.Fill(dt);
                }
            }

            var sNumRows = dt.Rows.Count.ToString();
            var sDT = JsonConvert.SerializeObject(dt);
            result = "{ \"current\": 1, \"rowCount\": 10, \"rows\": " + sDT + ", \"total\": " + sNumRows + " }";
        }
        catch (Exception ex)
        {
        }
        finally
        {
            cmd.Dispose();
            THF.Models.SQLConnectionManager.CloseConn(con);
        }

        return result;
    }

score 0 · Answer 3 · answered Apr 07 '17 at 07:19

My problem was that: I was using CompleteRequest instead of Response.End (inorder to avoid thread abort exception):

    Response.Clear();
    Response.Write(Converter.ToJson(resObj));
    HttpContext.Current.ApplicationInstance.CompleteRequest(); // seems to cause the problem

So I replaced my code with below and, surprisingly, it worked.

    try
    {
        Response.Clear();
        Response.Write(Converter.ToJson(resObj));
        Response.End();
    }
    catch (System.Threading.ThreadAbortException tae)
    {
        // ignore
    }

Uncaught SyntaxError: Unexpected token < in JSON with ASP.Net WebMethod

3 Answers3