Problem with $.each in jquery

Question

I am trying to populate a jqGrid search form using a SELECT element. In the colModel for the interested column I have

searchoptions: {
    dataUrl: '<%: Url.Content("~/Contact/GetCustomers") %>',
    buildSelect: function (response) {
        var theSelect = "<select>";
        $.each(response, function (i, data) {
            theSelect += '<option value="' + data.Value + '">' + data.Text + '</option';
        });
        theSelect += "</select>";
    },
    sopt: ['eq', 'ne']
}

the remote method GetCustomers return a json result formatted as

[{"Selected":false,"Text":"David Gilmour","Value":"10"},
 {"Selected":false,"Text":"Eric Clapton","Value":"26961"},
 {"Selected":false,"Text":"Joan Baetz","Value":"26972"}]

but with the code that I have used for the each function I am getting the following error

alt text

What is the value `response` being passed in? Can you show us what it looks like in your debugger? — Kirk Woll, Dec 08 '10 at 16:53

score 1 · Answer 1 · answered Dec 08 '10 at 16:59

1

response is just a string it needs to be parsed using something like json2.js

var data = JSON.parse(response);

answered Dec 08 '10 at 16:59

NimChimpsky

46,453
60
198
311

score 1 · Accepted Answer · answered Dec 08 '10 at 17:08

Since (according to your comment above) you're getting the XMLHttpRequest object, you need to parse its response text.

var parsed = $.parseJSON( response.responseText );

$.each( parsed, function(...

Or modify the code that is passing the response to pass just the response text, or the parsed result.

score 1 · Answer 3 · edited May 23 '17 at 12:07

1

Look at the close answer. It seems to me you should modify the code a little:

buildSelect: function(data) {
    var response = jQuery.parseJSON(data.responseText);
    var s = '<select>';
    if (response && response.length) {
        for (var i = 0, l=response.length; i<l ; i++) {
            var ri = response[i];
            s += '<option value="' + ri.Value +
                 (ri.Selected ? '" selected="selected">': '">') +
                 ri.Text + '</option>';
        }
   }
   return s + "</select>";
}

edited May 23 '17 at 12:07

Community

1
1

answered Dec 08 '10 at 17:19

Oleg

220,925
34
403
798

thans a lot. This will work as well. The problem was in using `parseJSON(response.responseText);` as indicated by @patrick_dw and even present in your answer. After that modification the `$.each` block in my code works fine and is more compact. Thanks a lot! – Lorenzo Dec 08 '10 at 17:23
@Lorenzo: You welcome! The most important is that your problem is solved. To tell the truth I prefer to write answers to jqgrid and not on pure jQuery/jQuery UI questions because I write/type prity slow. :-) – Oleg Dec 08 '10 at 17:34
I know what you mean. For me you are the maximum reference on jqGrid!! :) – Lorenzo Dec 08 '10 at 23:05

score 0 · Answer 4 · answered Dec 08 '10 at 16:54

0

Are you parsing this JSON object so you can read it as an actual JS object proper?

Since you are returning an array of JSON objects, you might have to parse each object individually as you iterate.

answered Dec 08 '10 at 16:54

Bryan A

3,598
1
23
29

score 0 · Answer 5 · answered Dec 08 '10 at 16:56

0

I would try using $(this) inside the each function. Though it looks right, something may be fishy with the result. Alternativly you could use a for (var d in data) (I think) for iterating over a JSON.

answered Dec 08 '10 at 16:56

Brad Christie

100,477
16
156
200

Problem with $.each in jquery

5 Answers5