Hi,
The method I have used is little different.
In the XML page, I have written the following code -
<IconTabFilter
icon="sap-icon://add-coursebook">
<VBox class="marginBoxContent" >
<Label text="Upload Attachment File" />
<u:FileUploader
id="fileUploader"
name="myFileUpload"
width="400px"
tooltip="Upload your file to the local server"
uploadComplete="handleUploadComplete"/>
<Button
text="Upload File"
press="handleUploadPress"/>
</VBox>
</IconTabFilter>
Now the code for event handleUploadPress is as follows -
handleUploadPress : function (evt) {
oDialog = new sap.ui.commons.Dialog();
var Service1 = window.location.origin
+ "/sap/opu/odata/sap/ZEBAN_FINAL1_SRV/EBANPRPROCESSSet";
var Service2 = window.location.origin
+ "/sap/opu/odata/sap/ZEBAN_FINAL1_SRV/ATTACHUPLOADSet";
var oView = this.getView();
var oUploader = oView.byId("fileUploader");
var oFileUploader = this.getView().byId("fileUploader");
// var file = jQuery.sap.domById(oFileUploader + "-fu").files[0];
// var BASE64_MARKER = 'data:' + file.type + ';base64,';
oDialog = new sap.ui.commons.Dialog();
var file = jQuery.sap.domById(oUploader.getId() + "-fu").files[0];
var BASE64_MARKER = 'data:' + file.type + ';base64,';
;
// var oRequest = sap.ui.getCore().getModel(this.getModelName())._createRequest();
var filename = file.name;
var var_banfn = oView.byId("Obj001").getBindingContext().getProperty("Banfn");
var reader = new FileReader();
// On load set file contents to text view
reader.onload = (function(theFile) {
return function(evt) {
var base64Index = evt.target.result.indexOf(BASE64_MARKER)
+ BASE64_MARKER.length;
// oModel1 = sap.ui.getCore().getModel("CreateModel");
// oModel.oData.field = evt.target.result.substring(base64Index);
var base64 = evt.target.result.substring(base64Index);
// *****************************8
var imgdata1 = {
"Banfn" : var_banfn,
"Filename" : filename,
"Filetype" : BASE64_MARKER,
"Attachment" : base64
};
var service_url = Service2;
imgdata = JSON.stringify(imgdata1);
$.ajaxSetup({ cache: false });
jQuery.ajax({
url : Service1,
type : "GET",
async: false,
beforeSend : function(xhr) {
xhr.setRequestHeader("X-CSRF-Token", "Fetch");
},
// *****************End of CSRF Token
// Fetch******************************************//
success : function(data, textStatus, XMLHttpRequest) {
token = XMLHttpRequest.getResponseHeader('X-CSRF-Token');
}
});
$.ajaxSetup({
cache : false
});
jQuery.ajax({
url : service_url,
async : false,
dataType : 'json',
cache : false,
data : imgdata,
type : "POST",
beforeSend : function(xhr) {
xhr.setRequestHeader("X-CSRF-Token", token);
xhr.setRequestHeader("Content-Type", "application/json");
},
success : function(odata) {
oDialog.setTitle("File Uploaded");
oDialog.open();
document.location.reload(true);
},
error : function() {
oDialog.setTitle("File Uploaded");
oDialog.open();
document.location.reload(true);
}
});
};
})(file);
// Read in the file as text
reader.readAsDataURL(file);
return;
},
I think you will be able to make-out from the code. In the gateway front you have to make configuration accordingly. This code will work even in mobile devices. I am uploading purchase requisition attachments using this code.
Regards,
Subhabaha Pal