Inline Editing With File Upload Error

samevedzi

Hi,

I'm trying allow inline editing with the ability to upload a file. The file is uploaded in the Uploads folder, the record is inserted into the Upload table in the database but the ID is not being assigned to the foreign key.

I am getting the following error in the process:

DataTables warning: table id=Table_Requisition - This request does not have a Content-Type header. Forms are available from requests with bodies like POSTs and a form Content-Type of either application/x-www-form-urlencoded or multipart/form-data.

samevedzi

Below is the relevant content of my script files:

View JavaScript

var Editor_Requisition = new $.fn.dataTable.Editor({
            ajax: "/Requisition/All",
            table: "#Table_Requisition",
            fields: [
                {label: "Item:", name: "Requisition.Item_ID", type: "select", placeholder: "Select an Item"},
                {label: "Quantity:", name: "Requisition.Qty"},
                {
                    label: "Attachment:",
                    name: "Requisition.File_ID",
                    type: "upload",
                    // display: function (File_ID) {
                    //     console.log("Requisition.File_ID: " + File_ID);
                    //     return '<a href="' + Editor_Requisition.file('File_Upload', File_ID).WebPath + '" target="_blank">File</a>';
                    // },
                    clearText: "Clear",
                    noImageText: 'No Attachment'
                }
            ]
        });
        
 const dataTableReqObject = {
                dom: "Bfrtip",
                ajax: {
                    url: "/Requisition/All",
                   type: 'POST'
                    dataType: "json",
                    contentType: "application/json",
                    data: function (d) {
                        console.log('data',d);
                        d.StartDate = $("#Input_StartDate").val();
                        d.EndDate = $("#Input_EndDate").val();
                    }, 
                    dataSrc: function (d) {
                        console.log('dataSrc',d) 
                        return d; 
                    }
                }, 
        serverSide:true,
        processing:true
                ]
            }
            
            const dataTableReqCols = [              
                {"data": "Item.Description",editField: "Requisition.Item_ID"},
                {"data": "Requisition.Qty"},
                { "data": 'File_Upload.WebPath', render: function ( data, type ) { 
                        if (!data) return 'No attachment'; 
                        // If you have direct access to file data in your row
                        if ( data ) {
                            return type === 'display' ?
                                '<a href="' + data + '" target="_blank">File</a>' :
                                data;
                        } 
                    }}
            ];

            Editor_Requisition.on('submitSuccess', function () {
                Datatable_Requisition.ajax.reload();
            });
            }

samevedzi

Controller

            var editor = new Editor(db, "Requisition", "ID")
                .Model<Requisition>("Requisition")
                .Field(
                    new Field("Requisition.File_ID")
                        //.SetFormatter(Format.NullEmpty())
                        .Upload(
                            new Upload(Path.Combine(env.WebRootPath, "uploads", "__ID____EXTN__")) 
                                .Db("File_Upload", "ID", new Dictionary<string, object>
                                {
                                    {"FileName", Upload.DbType.FileName },
                                    {"FileSize", Upload.DbType.FileSize },
                                    {"WebPath", Upload.DbType.WebPath },
                                    {"SystemPath", Upload.DbType.SystemPath },
                                    { "CreatedBy", User_ID },
                                    { "ModifiedBy", User_ID }
                                }) 
                                .Validator(Validation.FileSize(11000000, "Max file size is 10MB."))
                                .Validator(Validation.FileExtensions(new[] { "jpg","jpeg", "png", "gif", "pdf" }, "Please upload an image or pdf."))
                        )
                )

I have tried to follow the suggestions in the following link, but without success:

https://datatables.net/forums/discussion/comment/183835/#Comment_183835

Kindly assist or point me to some resource I can refer to.

Thanks.

allan

Interesting! I'm not sure I've encountered that particular error before. Are you able to PM me a link to the page so I can take a direct look at the Ajax request that is being sent?

Thanks,
Allan