Skip to Content

uploading signature pad to odata

Dec 01, 2017 at 10:37 AM


avatar image


I have implemented SAPUI5 signature pad and sending image(signature content) to SAP. My issue is passing signature pad image data to SAP using OData.request Post method.

I am stuck at below step 2. I will really appreciate if you can provide some guidance.

Step 1 - I am able to get signature pad image data(content) and attached is copy of content looks like.


Step 2 - Sending Image data to SAP using OData.request post method . In SAP

/IWBEP/IF_MGW_APPL_SRV_RUNTIME~CREATE_STREAM class method I am only receiving IS_MEDIA_RESOURCE-mime_type I am not able to get

IS_MEDIA_RESOURCE-value. Below is my OData call logic.

var sgnurl = sap.ui.getCore().byId("SignatureImage").getSrc();

requestUri: "/sap/opu/odata/sap/ZZxxxxxxxxxx/xxxxxSet",
method: "POST",
headers: {
"X-Requested-With" : "XMLHttpRequest",
"Content-Type" : "application/atom+xml",
"Content-Type" : "image/png", //"image/jpeg",
"slug" : "image/png",
"DataServiceVersion" : "2.0",
"Accept" : "application/atom+xml,application/atomsvc+xml,application/xml",
"X-CSRF-Token": header_xcsrf_token,
Data: sgnurl
function(data, response) {
alert("OData call success");
function(err) {
alert("OData call Error");

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

Best Answer
Arjun Biswas Dec 02, 2017 at 04:53 AM

Hi Aman Anand,

For any media uploading to OData, you have to give the $value URI.

this._token = this._model.getSecurityToken();       //Get the model's CSRF security token 
                                                    //first (preferably in the init method of your controller)

//For uploading the file, use the following code

			 * To upload only the file (using AJAX).
			 * @public
				var oFileUpload = sap.ui.getCore().byId("fileUploader");     //get the control instance
				var f = evt.oSource.oFileUpload.files[0];                    //get the file
				var entry = {};
				entry.Photo = f;
				var url="proxy/http/xxx.XX.xx.XXX:xxXX/sap/opu/odata/sap/ZPRJ_SRV/userPhotoSet('"+this._id+"')/$value";
		        //var oRequest = this.getView().getModel()._createRequest();
		        var oHeaders = {
		                  "x-csrf-token": this._token
		        		//Calling the AJAX function and sending the data, the content type, as well as the CSRF token.
		                  type: 'PUT',
		                  headers: oHeaders,
		                  cache: false,
		                  contentType: false,
		                  processData: false,
		                  data: f,


In my case I get the instance of the file uploader in my controller, then I get the file to be uploaded, and I send the file to OData via the ajax method.

Hope this helps,


Show 1 Share
10 |10000 characters needed characters left characters exceeded

Hi Arjun,

Thanks for your input. I can't use fileUpload as i don't have to get the media data from my desktop. I have to save the signature at runtime and send back the generated base-64 link to the backend.