jquery AutoComplete in Editor always gets error function

greggreggreg

I have a datatable that has a editor, within that editor I am after a AutoComplete field that does a Ajax call.

fields: [{
    "label" : "Supervisor",
    "name": "supervisor_id",
    "type": "autoComplete",
    "opts": {
        source: function(request, result) {
            $.ajax({
                type: "POST",
                cache: false,
                async: false,
                url: 'people_list.php',
                data: request,
                dataType: "json",
                success: function (result) {
                     },
                error: function(result) {
                    str = JSON.stringify(result);
                    str = JSON.stringify(result, null, 4);
                    console.log(str);
                    console.log("Failed");
                }
            });
        }
    }
       }]

This is what my server side is returning:
[{ label: 'C++', value: 'C++' },{ label: 'Java', value: 'Java' },{ label: 'COBOL', value: 'COBOL' }]

No matter what I do, the error always triggers.

Any ideas please?
Also, I have no idea what to put into success to populate the datatable field please?

Note: my real data looks like this, but I have simplified server side to ensure there are no issues there:
[{ label: 'Fred', value: 1 },{ label: 'Jane', value: 2 },{ label: 'Joe', value: 3 }]

allan

If you are using different labels from values, unless you are already using jQuery UI AutoComplete elsewhere in your application and are familiar with it, I would suggest not using it. Having it work with different labels and values, in my experience, a real pain!

The reason your code is dropping into the error function is that the response from the server is not valid JSON.

You can run your "JSON" through JSONLint to check it, but basically to be valid JSON the keys must be in double quotes, as much the value (unless it is a number - i.e. single quotes are not valid JSON).

Allan