This is a migrated thread and some comments may be shown as answers.

File upload with SQL insert

1 Answer 164 Views
Upload
This is a migrated thread and some comments may be shown as answers.
Attila
Top achievements
Rank 2
Attila asked on 03 Nov 2017, 10:17 AM

Hello!

I would like to upload a file to the server and also write some data into SQL database after the user fills a form with those metadata. I used the widget this way:

 

@Html.Kendo().Upload().Name("docUpload").Async(a => a.Save("UploadFile", "Dokumentum", new { id = Model.Id }).AutoUpload(false)).Multiple(true).Events(ev => ev.Upload("onUpload").Error("onError").Success("onSuccess"))

 

The widget first calls onUpload javascript that calls the action that stores the metadata in SQL (input parameter is json). This action returns empty content if successful, or content with the error message if fails.

Either the first action was successful or failed, the widget calls the UploadFile action, that stores the file on the server (input parameter is HttpPostedFileBase). This action also returns with an empty content if it was successful.

This is works perfectly. My problem is, that what if the metadata writing fails (because of some validation or anything) and the file will be copied to the server. Or the metadata writing is successful but the file store fails. I would like the widget returns successful message only if both are successful or error message if one of them fails (of course the other action shouldn't be executed).

 

Here's the onUpload javascript:

function onUpload(e){
 
var json=new Object();
json["json"]=JSON.stringify({...blah-blah});
 
$.ajax({
url: '@Url.Action("Save,"Controller"),
async: false,
type:"POST",
data:json,
dataType:'json',
success:function(result){},
error:function(error){}
});
}

Thanks for your help

1 Answer, 1 is accepted

Sort by
0
Neli
Telerik team
answered on 06 Nov 2017, 04:11 PM
Hi Attila,

If the Ajax call in the upload method handler returns error, than the execution of the 'Save' action ( to avoid misunderstanding - in your example the name of the action is 'UploadFile') could be prevented.
Take a note, that this approach may not work for large files, because it could take longer to the request to receive a response and in the meantime the 'Save' action could be executed.
$.ajax({
url: '@Url.Action("Save","Controller")',
async: false,
type:"POST",
data:json,
dataType:'json',
success: function (result) {
},
error: function (error) {              
e.preventDefault();               
}
});

I would recommend to make all the validations in the 'Save' action. If the saving of the file fails for any reason, the 'error' event will be triggered. In case, the file is successfully saved, the 'success' event will be triggered.

Note, that the status of the uploaded file depends on the result from the async.saveUrl method. The responses for the success are empty response or JSON string with 'text/plain' content encoding. Every other response is considered as failure. You could read more in the following article.

Regards,
Neli
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Upload
Asked by
Attila
Top achievements
Rank 2
Answers by
Neli
Telerik team
Share this question
or