Skip to Content
Author's profile photo Sreehari V Pillai

Transferring complex structured data from UI to XSJS – POSTing JSON

Hi Folks,


     I would like to share one idea with you guys . I have seen couple of questions posted in SCN(and outside SCN too) regarding how to create deep entity set , how to update complex structures through OData operations etc. Well, this blog does not talk about handling these scenarios using OData calls but trying to achieving such scenarios using XSJS . Here, I am explaining how we can pass complex JSON structure directly to the XSJS context for processing.

Designing the UI5


     Here we are designing the UI5 application from where the POST call will be triggered to the back end XSJS service. For this I created on simple table control with 6 columns and bind it with an OData service ( for testing it, I am using JSON model ).


Triggering the XSJS service with the JSON Data using AJAX Call

     In the submit button click, we will get the table binding context and get the corresponding JSON object associated with the table. Which would contain the current values in the table. It will automatically hold any data change that we have made in the table entries.

return new sap.ui.commons.layout.MatrixLayout({
  id : "matrix1",
  layoutFixed : false
  createRow(new sap.ui.commons.Button({
  text : "Submit",
  press : function(evt){
  //Getting the JSON data bound to the table object (oTable)
  var JSONData = oTable.getBinding().getModel().oData.modelData;
  //Converting the JSON object to a string variable (formalluy serialization)
  var JSONString = JSON.stringify(JSONData);
  //Making an AJAX POST call
  $.post("proxy/Finance/XSApps/test.xsjs",//this is the target URL
  { JSON_DATA: JSONString } //Data passing with attribute naem JSON_DATA
  ).done(function( data ) {//Success function call
     alert( "Data returned rom XSJS: " + data );

In the above code snippet, all what I am doing is generating the JSON data, serializing it and attaching the same in the POST call made against the target XSJS service.

Designing the XSJS back end


     Designing the XSJS back end is quite easy . We have sent the JSON data to the target XSJS through a POST call. So the required data will be available in the request object. It is a key value pair, where the key name here is JSON_DATA and the value will be the serialized JSON object. We now need to de serialize the JSON string to JSON object . JSON.parse() method would help us for this task.

var JSONString = $.request.parameters.get("JSON_DATA");//Reading the input JSON string
var JSONObj = JSON.parse(JSONString);//serializing the input string
// Now we have the JSON object with us. Do what ever manipulation you want to do on it.
//For the test case i am just returning the number of rows in the JSON object

Testing the service :


This is the smallest blog I have written.But for me , it was too helpful . When you face such a situation where you need to send complex structured data to the back end , this method would help you.

Share your views regarding performance(or anything).

Sreehari V Pillai

“Save Nature For the Future”

Assigned Tags

      You must be Logged on to comment or reply to a post.
      Author's profile photo Prashanth P
      Prashanth P

      Good one!

      very useful information.

      Thank you Sree šŸ™‚

      Author's profile photo Muhammad Sadiq
      Muhammad Sadiq

      Could you kindly share how we can do the same without using Designing the UI5 ?

      Author's profile photo Sreehari V Pillai
      Sreehari V Pillai
      Blog Post Author

      As we aware, XSJS is a web service . If not SAPUI5, same other client tool has to post the data. The reason I chose JavaScript based tool is because , here it is easy to build the JSON structure. From where you are trying to pass the data to XSJS ?

      Author's profile photo Sergio Guerrero
      Sergio Guerrero

      thanks for sharing this blog.. however, a quick comment here:

      for POST (request) you should read the body of the request.

      for GET (request) you should read the parameter.get  as you have on your blog.

      hope this is clear -

      Author's profile photo Suneet Agera
      Suneet Agera

      Hi Sergio,

      What is the code to read the body of the POST request? Is there a resource I could find this?

      Author's profile photo Sergio Guerrero
      Sergio Guerrero


      you could use this line of code to get your request as a JSON object on the XSJS side

      var req = JSON.parse($.request.body.asString());

      Author's profile photo Suneet Agera
      Suneet Agera

      Thanks Sergio. Is there a document/link that talks about these basics? Or is it the HANA developer guide?

      Author's profile photo Former Member
      Former Member

      Hello. How can we get parameters from $.request.body? And where I can search for API reference?

      Author's profile photo Suneet Agera
      Suneet Agera

      Hello Eugeny,

      I am not sure you get parameters in a POST. You get that in a GET call.



      Author's profile photo SAVITH S
      SAVITH S

      Hi Zabus,

      Normally POST methods are passing values through the body not using the header/url. So there is no parameter concept/it is neither visible in front of user nor attaching with URL. That is the main difference here. So for extracting values, you have to extract it from json file.

      var body = $.request.body;Ā  // access the body of JSON

      var json = JSON.parse(body); // parse the body



      var values = json.C;

      var temp_store = [];

      for(var i in values){

      temp_store[i] = values[i].Name + values[i].Mark2;


      // assume json file contains a Parent Key "C" under that- Name: "cs" and Mark: "234"


      Hope it helps -


      Savith Satheesh

      #very late reply -:) may be useful for others

      Author's profile photo Anushya K
      Anushya K

      could We transfer image from UI to xsjs???

      Author's profile photo Sreehari V Pillai
      Sreehari V Pillai
      Blog Post Author

      should be possible with a multi part ... Could you solve this issue ?


      Author's profile photo Former Member
      Former Member

      HiĀ Ā Former MemberĀ ,

      If you set body with JSON object, something like this $.response.setBody(JSONObj) then I am assuming some sort of file will get download?

      Author's profile photo Sreehari V Pillai
      Sreehari V Pillai
      Blog Post Author

      surely not. setBody will set the http body part with the given string. JSONObj in


      must be a string type. So , its propagated to the UI as a plain text. Not as a file . ( File download needs headers to append )



      Author's profile photo Former Member
      Former Member

      Hi Sreehari,


      I need your help urgently on an XSJS project. I am creating a chatbot like app. And I have created an ODATA service which is fetching purchase order details from SAP backend. so from my chatbot I want to send parameters details and fetch accordingly, but I am unable to create POST function in xsjs. Please connect with me at

      Please help me out.


      Author's profile photo Sreehari V Pillai
      Sreehari V Pillai
      Blog Post Author

      Hi Pulakesh,

      Please describe your issues as a question in SCN and share the link here. It will be helpful to other community members as well.


      Author's profile photo Jay Prakash Singh
      Jay Prakash Singh

      Hi All,


      I am facing issue described in the blog

      can anyone take a look please .