error on image upload- Cannot read property 'id' of undefined

crush123

I have a editor instance to add members to a table which is working fine.

I have just added an image upload option to the editor, (1.5.3) and if i try to add an image, I get an error Uncaught TypeError: Cannot read property 'id' of undefined. - dataTables.editor.js:3811

I tried copying the upload code snippet from a working page, and cant seem to fix it.

Probably something silly, but would appreciate another pair of eyes

http://www.test.forthwebsolutions.com/admin/members/plugins/members.php

allan

The response from the upload command is not the JSON that Editor expects. It looks like an edit response:

{
    "data": [{
        "DT_RowId": "row_4",
        "tblmembers": {
            "MemberID": "4",
            "MemberFirstName": "Alan",
            "MemberLastName": "Smith",
            "EmailAddress1": "asmith@hotmail.co.uk",
            "EmailAddress2": "",
            "MemberSection": "4",
            "MemberImageURL": "",
            "UserLevel": "2",
            "Display": "1",
            "Active": "1",
            "OccasionalTeam": "0"
        },
        "refsection": {
            "SectionDescription": "Bass 1"
        }
    }, {
        "DT_RowId": "row_5",
        "tblmembers": {
            "MemberID": "5",
            "MemberFirstName": "Andy",
            "MemberLastName": "Jones",
            "EmailAddress1": "ajones@hotmail.co.uk",
            "EmailAddress2": "",
            "MemberSection": "5",
            "MemberImageURL": "",
            "UserLevel": "2",
            "Display": "1",
            "Active": "1",
            "OccasionalTeam": "0"
        },
        "refsection": {
            "SectionDescription": "Bass 2"
        }
    }],
    "options": [],
    "files": [],
    "refsection": [{
        "value": "1",
        "label": "Musical Director"
    }, {
        "value": "2",
        "label": "Alto 1"
    }, {
        "value": "3",
        "label": "Alto 2"
    }, {
        "value": "4",
        "label": "Bass 1"
    }, {
        "value": "5",
        "label": "Bass 2"
    }, {
        "value": "6",
        "label": "Soprano 1"
    }, {
        "value": "7",
        "label": "Soprano 2"
    }, {
        "value": "8",
        "label": "Tenor 1"
    }, {
        "value": "9",
        "label": "Tenor 2"
    }, {
        "value": "10",
        "label": "ZZ- Site Administrator"
    }]
}

Whereas it should be something like:

{
    "data": [],
    "files": {
        "files": {
            "2": {
                "id": "2",
                "filename": "Screen Shot 2015-12-09 at 15.42.33.png",
                "filesize": "11298",
                "web_path": "\/upload\/2.png",
                "system_path": "\/home\/datat\/public_html\/editor\/upload\/2.png"
            }
        }
    },
    "upload": {
        "id": "2"
    }
}

This example might be of some use.

Allan

crush123

Please indulge me by looking at this page, which works, and I believe has the same json

http://test.forthwebsolutions.com/admin/content/plugins/events.php

allan

If I upload a file it responds with something like:

{"data":[],"files":[],"upload":{"id":"231301273.jpg"}}

from the upload request. That looks correct and valid to me.

Allan

crush123

Thanks Allan.

Seeing the problem, and being able to work out WHY it was causing me an error took me all day to track down, but I finally found out the problem.

when i call the editor instance, if I use

$(document).ready(function() {

var editor = new $.fn.dataTable.Editor( {

    ajax: "/ajax/members.php",

    table: "#example",

the upload works fine

if i use the syntax

$(document).ready(function() {

var editor = new $.fn.dataTable.Editor( {
    ajax: {
        url: "/ajax/members.php"
            },
    table: "#example",

i get the error message as described

allan

What version of Editor are you using? The second should work well in the latest versions.

Thanks,
Allan

crush123

Hi Allan, I am using 1.5.3

I can upload a comparative sample if it helps

original code, (fails) link as above

http://www.test.forthwebsolutions.com/admin/members/plugins/members.php

new code (works)

http://www.test.forthwebsolutions.com/admin/members/plugins/members2.php

(it is only a problem with upload, if the record is edited without changing the upload data, it works fine)

allan

Got it! Thanks for the clarification. The fix will be included in Editor 1.5.5, but in the mean time if you want to apply the fix locally, in Editor search for:

$.ajax( $.extend( ajax, {

and replace with:

$.ajax( $.extend( {}, ajax, {

The issue was that the original Ajax object was being modified rather than a new object being created.

Regards,
Allan