An error occured on upload

An error occured on upload

heizlerheizler Posts: 10Questions: 3Answers: 0

I have the same issue as this post below. The file is saved to the database and all but I keep hitting an error when trying to return the right Json to editor.

https://datatables.net/forums/discussion/comment/225563/#Comment_225563

This is my return. I am using c# and I have tried using return Json(), returning it as a string, and JsonSerializer:

{
"files": {
"fileId": 1
}
}

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 65,056Questions: 1Answers: 10,772 Site admin

    Hi,

    Have you taken a look at the Ajax request in the browser's network inspector? That might give a clue as to what is going wrong.

    Can you give me a link to the page so I can take a look? You can PM it to me if you don't want to make it public :).

    Allan

  • heizlerheizler Posts: 10Questions: 3Answers: 0
    edited August 13

    Hey Allan, unfortunately I can't. The application is not external. I have change the response json multiple times. Currently, this is what I have:
    {
    "files": {
    "file": {
    "fileId": 12,
    "fileName": "CallEndpointwAuthHeader.PNG",
    "webPath": "/ProjectInfo/Download/630"
    }
    }
    }

    My editor javascript code for the upload looks like this:

     {
         label: 'File Upload:',
         name: 'upload',
         type: 'upload',
         ajax: {
             url: addAttachmentURL, // Replace with your server-side upload endpoint
             type: 'POST',       // Use POST for file uploads
             data: function (d) {
                 // Optional: Add extra data to the upload request if needed
                 d.upload = $('#DTE_Field_attachmentTitle');
                 d.projectId = projId;
                 d.attachmentGroupId = $('#DTE_Field_attachmentGroupId').val();
                 return d;
             }                
         },
         display: function (files) {
             console.log(files.file.fileId);
             return attachmentEditor.file('files', file.fileId).filename;
         },
         clearText: 'Clear',
         noFileText: 'No File Selected'
     },
    

    The documentation is pretty vague on this particular topic. Can you help me figure this out?

    By the way, I am not saving the file to the file system. I am using MemoryStream to save it directly to the database. Do I need to save it to the file system for this to work properly?

  • allanallan Posts: 65,056Questions: 1Answers: 10,772 Site admin

    The response should look something like this:

    {
        "files": {
            "files": {
                "3": {
                    "id": 3,
                    "filename": "image.png",
                    "filesize": 65164,
                    "web_path": "\/uploads\/3.png",
                    "system_path": "\/usr\/share\/nginx\/html\/uploads\/3.png"
                }
            }
        },
        "upload": {
            "id": "3"
        }
    }
    

    The documentation for it is available here.

    The key part is the upload.id property, which Editor will look for to know what the primary key identifier for the file is. That is currently missing from your response. You also need to nest the file information in an object with the primary key's value - so your response might look something like:

    {
        "files": {
            "file": {
                "12": {
                    "fileId": 12,
                    "fileName": "CallEndpointwAuthHeader.PNG",
                    "webPath": "/ProjectInfo/Download/630"
                }
            }
        },
        "upload": {
            "id": "12"
        }
    }
    

    Allan

  • heizlerheizler Posts: 10Questions: 3Answers: 0

    Hey Allan, the information you've given me has been extremely helpful and I am able to make the upload work, just not in a way that would be useful. I think the way I think it should work is not the way it is designed, so I will have to build my own file upload process. What I expect is:

    1. User clicks "Choose File" > Filename is displayed to the user but the upload has not happened yet. This is important because the user may choose the wrong file and need to do the "Choose File" process over again. The way it currently works would require some process to delete the file that was just saved to the database which over complicates things.
    2. User clicks "Create" > File is saved to the db with any other metadata necessary. In my case "Attachment Group".

    This workflow doesn't seem possible with Editor in its current form. Would you agree? Or am I missing something?

  • allanallan Posts: 65,056Questions: 1Answers: 10,772 Site admin
    Answer ✓

    Hi,

    Yes you are right - the way the file upload works for Editor is to send an Async request to the server to upload the file, so it might be present before the host row has been created. If that row is never created, then the file is considered to be "orphaned". The provided libraries have a method for help to handle this, which also covers row deletion as well.

    This method works well for cases where the file is a foreign key reference in the host table (i.e. a left join to a files table). It isn't so useful if you want to store the file in the host table.

    Adding synchronous upload is something that I am considering for a future version, unfortunately it is not a feature of Editor at this time, but I can look more into it.

    Allan

  • rf1234rf1234 Posts: 3,177Questions: 92Answers: 438
    edited August 14

    Some users want to upload many files, mostly an entire folder. I tell them to zip it and upload the zip file. Done. I guess this would also deal with @heizler 's use case.

    Advantages:
    The data table display isn't polluted with dozens of files displayed but just one zip file.
    Simple upload.

  • heizlerheizler Posts: 10Questions: 3Answers: 0

    Oh that definitely makes sense but is a bit more involved than our simple case. We only have the host table and are only uploading 1 or 2 documents for project documentation. If you get around to adding the synchronous version in the future definitely keep the existing version and potentially provide an option for synchronous vs asynchronous

  • allanallan Posts: 65,056Questions: 1Answers: 10,772 Site admin

    Absolutely! The default wouldn't change - very likely it would be an async option in the upload configuration object. It would change the Editor form submission, but that can be taken account of. I try to make sure changes are backwards compatible :)

    Are you sorting the files in the db, or in the file system?

    Allan

Sign In or Register to comment.