returning List from JSON call in Jquery has undefined length

Question

I am making a call to a webservice from jquery and trying to return an List (I have also tried a string[]). When I get the results back I can see it holds an array with the values I need, but I can not iterate through them in Javascript because there is no length value.

my C# Webservice is as follows:

    [WebMethod]
    public string[] GetMultiChoiceOptions(int keyId)
    {
        string connectionString = System.Web.Configuration.WebConfigurationManager.ConnectionStrings["OBConnectionString"].ConnectionString;
        SitesUtil db = new SitesUtil(connectionString);
        List<MultiChoiceOption> keys = db.GetMultiChoiceOptions(keyId, 1); //TO DO CHANGE THIS TO REAL USERID

        return keys.Select(a => a.OptionValue).ToArray();
    }

and My Jquery/javscript call is as follows:

function GetKeys(keyid) {

    var pageUrl = '<%=ResolveUrl("~/WebService/UpdateDatabase.asmx")%>'
    $.ajax({
        type: "POST",
        url: pageUrl + "/GetMultiChoiceOptions",
        data: '{keyId:' + keyid + '}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: GetKeysSuccessCall,
        error: OnErrorCall
    });
}

function GetKeysSuccessCall(response) {
    /* TO DO */
    var i = 0;
    for (i =0; i < response.length; i++) {
        $("#popupList").append('<li>' + response[i] + '</li>');                
        }       
}

I'm not sure how I deal with an array without a length in javascript?

You should show what it is returning your web service as a response — Alexander, Aug 21 '12 at 06:59
If it is an object, you need `for in` object iteration or $.each instead — mplungjan, Aug 21 '12 at 06:59
Possible duplicate of: http://stackoverflow.com/questions/5223/length-of-javascript-object-ie-associative-array — Matías Fidemraizer, Aug 21 '12 at 07:09

score 2 · Answer 1 · answered Aug 21 '12 at 07:05

2

I think you should use first of all the JSONSerializer to send the rigth json structure to the client.

You should return only a string, which has the JSON format, and then it will work!

answered Aug 21 '12 at 07:05

András Ottó

7,605
1
28
38

Snake Eyes · Accepted Answer · 2012-08-21T07:25:51.373

1

First, use Google Console. Best and helpful.

To see what you receive, use console.log(response); (instead of alert and do NOT use in IE because it doesn't know console)

try first of all

$.ajax({
        type: "POST",
        url: pageUrl + "/GetMultiChoiceOptions",
        data: '{keyId:' + keyid + '}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(response){
          GetKeysSuccessCall(response);
        },
        error: function(msg) {
           OnErrorCall(msg);
         }
    });

And one more :

function GetKeysSuccessCall(response) {
    /* TO DO */
    var i = 0;
    for (i =0; i < response.length; i++) {
        $("#popupList").append('<li>' + response[i] + '</li>');                
        }       
}

repsonse must be instead of item

edited Aug 21 '12 at 07:25

answered Aug 21 '12 at 06:57

Snake Eyes

16,287
34
113
221

I will try this.. but i am using firebug, and I know im getting an object back with 4 strings, like I want.. but the object does not have a length property – Michael Aug 21 '12 at 07:02
resposne from function argument !!! not `item`. That's why the error occured because length is not property of NULL – Snake Eyes Aug 21 '12 at 07:27
Internet Explorer has a console object if you open the Developer Tools first (which you'd need to do to see the output anyway), so there's no reason you couldn't do the same thing in IE. – Anthony Grist Aug 21 '12 at 07:49

score 1 · Answer 3 · answered Aug 21 '12 at 22:21

1

I cant explain why it works, but what I needed to do was get the response.d value....

So this was the solution in the end:

function GetKeysSuccessCall(response) {
    /* TO DO */
    var result = response.d;

    var i;
    for (i = 0; i < result.length; i++)
    {
        $("#popupList").append('<li>' + result[i] + '</li>');         
    }
}

(if someone can explain where the .d comes from?)

answered Aug 21 '12 at 22:21

Michael

8,229
20
61
113

it is simply a security feature that Microsoft added in ASP.NET 3.5’s version of ASP.NET AJAX. By encapsulating the JSON response within a parent object, the framework helps protect against a particularly nasty XSS vulnerability. I think if you see my answer to the .each i used response.GetMultiChoiceOptionsResult; which has the same effect – Clinton Ward Aug 22 '12 at 07:04

Clinton Ward · Answer 4 · 2012-08-22T07:19:23.087

0

You can use the .each function like so

   success: function (response) {
            var options= response.d;
            $.each(options, function (index, option) {
                $("#popupList").append('<li>' + response[option] + '</li>'); 

            });
        },

or

function GetKeysSuccessCall(response) {
    /* TO DO */
    var i = 0;
    for (i =0; i < response.d.length; i++) {
        $("#popupList").append('<li>' + response.d[i] + '</li>');                
        }       
}

edited Aug 22 '12 at 07:19

answered Aug 21 '12 at 06:55

Clinton Ward

2,441
1
22
26

I just updated my answer to include result on the end of GetMultiChoiceOptions, so that its GetMultiChoiceOptionsResult – Clinton Ward Aug 21 '12 at 07:01
I cant test this because im not t work.. but I thought the jquery $.each method used the length property.. of which is undefined so i didnt think that would work.. Also the second answer i have already tried but response.length is undefined – Michael Aug 21 '12 at 10:41
first option. var options= response.GetMultiChoiceOptionsResult; options is undefined. Second option response.length is undefined – Michael Aug 21 '12 at 21:58

returning List from JSON call in Jquery has undefined length

4 Answers4