Uncaught TypeError: Cannot use 'in' operator to search for 'length'

beerygaz

I'm trying to populate a "select" field in the editor. I call a WebAPI controller which returns JSON data which subsequently tows this error:

Uncaught TypeError: Cannot use 'in' operator to search for 'length' in ["AIWEE","Melville","CRA"]
    at s (datatables.min.js:14)
    at Function.each (datatables.min.js:14)
    at Function.f.pairs (dataTables.editor.min.js:61)
    at Object._addOptions (dataTables.editor.min.js:139)
    at f.create (

My code is:

var areas = loadAreasfromAPI();
[...]
       {
                        "label": "Area:",
                        "name": "area",
                        "type": "select",
                        "options": areas
        },
[...]
   function loadAreasfromAPI() {
        var areas;
        $.ajax({
            type: "POST",
            url: '/api/AreasList',
            async: false,
            dataType: 'json',
            success: function (json) {
                areas = json;
            }
        });
        // return ["AIWEE","Melville","CRA"];
        return areas;
    }

some debugging reveals that areas = "["AIWEE","Melville","CRA"]"
I think it has something to do with areas containing a string (if I uncomment my return statement above it works) but I don't know how to get my controller to strip the leading and trailing quotation marks out.

allan

Perhaps try: return JSON.parse( areas );.

If that doesn't work what is the output of console.log( json ); inside the success callback?

Remind me once we've solved this part to show you how to do it without async:false as well! But one step at a time...

Allan

beerygaz

Awesome, that did it, thanks very much. I'm assuming without the async: false I'll get a faster page load time especially if there are a number of select fields to be populated in the same manner?

allan

Exactly that. The problem with async: false is that it blocks the entire UI until the request as completed.

So make it work without that, use:

            success: function (json) {
                editor.field('area').update( json );
            }

i.e. call the field's update method (see select) from the callback.

Allan