Question Re: ui5 image upload using oData in Technology Q&A

ui5 image upload using oData

rodrigo_esteves — Mon, 30 Mar 2015 17:37:55 GMT

Hello guys.

I got a simple ui5-oData CRUD which has the following:

a JS view
a JS controller

I'm able to choose a picture from my computer, but when I hit save button in my view it just goes null to the database. How can I properly get the image using my uploader component? Probably is not using getValue like the other fields. Any ideas.
I'm a newbie in ui5! Thanks in advance

My js view has the following ui5 component


var uploader = new sap.ui.unified.FileUploader(this.createId("uploader"),{
     id: "fileUploader",
            name: "myFileUpload",
            buttonOnly: true,
            uploadUrl: "upload/",
            tooltip: "Upload your file to the local server",
            fileType: ["jpg", "png"],
            uploadOnChange: true
         
  });

My controller has the following method


handleAcceptButtonPress: function(evt){
     var controller = this;
  var oModel = sap.ui.getCore().getModel();


  var jsonData = {
     "COMPANYDATAID": "0000000000",
  "COMPANYNAME": controller.byId("company-name-textfield").getValue(),
  "CORPORATENAME": controller.byId("corporate-name-textfield").getValue(),
  "PHONENUMBER": controller.byId("phone-number-textfield").getValue(),
  "CREATEDATE": null,
  "ADDRESS": controller.byId("address-textfield").getValue(),
  "SITE": controller.byId("cnpj-textfield").getValue(),
  "CNPJ": controller.byId("site-textfield").getValue(),
  "LOGO.LOGOID":controller.byId("uploader").getValue()
  };

  oModel.setHeaders({"content-type":"application/json;charset=utf-8"});
  oModel.create("/CompanyRegister", jsonData, null, function(oData, res){
  console.log("Partner creation successful");

  var oContext = oModel.createEntry("/CompanyRegister", oData);
  oContext.sPath = "/CompanyRegister("+oData.COMPANYDATAID+")";
  controller.nav.to("Detail", oContext);
  oModel.deleteCreatedEntry(oContext);
   
     controller.clearForm();
  }, function(err){
  alert("Partner creation failed");
  });
  },

Re: ui5 image upload using oData

former_member182372 — Mon, 30 Mar 2015 18:52:26 GMT

Rodrigo, submitting a form and uploading image are 2 different operations:

1) upload uses

uploadUrl: "upload/"

so it is usually SICF service

2) form submit uses OData "CompanyRegister" service (entity set)

couple things - why do you call deleteCreatedEntry? Check the browser's Network traffic in dev tools and see what is coming in and out to that service CompanyRegister

Re: ui5 image upload using oData

Former Member — Tue, 31 Mar 2015 04:49:56 GMT

hope this helps

Re: ui5 image upload using oData

Former Member — Wed, 27 May 2015 10:28:37 GMT

Hello Maksim,

While trying to upload image using FileUploader, I'm facing problems with server side xsjs as I am not able to get blob data from the image which is to be pushed inside the table. Could you please tell me how to extract the blob information in xsjs. Thanks in advance.

Re: ui5 image upload using oData

Former Member — Wed, 27 May 2015 17:41:01 GMT

Hi,

Will this help you ?

Thanks,

Jenish

Re: ui5 image upload using oData

Former Member — Fri, 29 May 2015 08:54:38 GMT

Its not working as I want to store image in hana table only & not in local folder