cancel
Showing results for 
Search instead for 
Did you mean: 

SAP FIORI: Redefine connectionhelper.js in timesheet HCM_TS_CRE

Former Member
0 Kudos

Hello Guys,

                  I want to redefine a function in connectionhelper.js of application HCM_TS_CRE as I have been extending the FIORI timesheet application. As connectionhelper.js is not a controller class I followed steps given in the document attached below (page 30) to add a line in component.js and create a new .js file to redefine the function.

However it is not working for me. Whenever I run my custom app it gives me blank screen.

Can anybody give me a good idea on how to override functions in non controller .js files, apart from what is mentioned in the attached document.

Thanks & Regards

Soubhik

[Removed by Moderator]

Message edited by: Michael Appleby

Accepted Solutions (1)

Accepted Solutions (1)

Former Member
0 Kudos

Can someone please help. I need to override functions in non controller classes. How to do that.

jamie_cawley
Advisor
Advisor
0 Kudos

In your component place the require after the component load...


sap.ui.component.load({

  name : "hcm.emp.mytimesheet",

  url : jQuery.sap.getModulePath("zhcm.emp.mytimesheet") + "/../hcm_ts_cre"

});

jQuery.sap.require("zhcm.emp.mytimesheet.utils.ConnectionHelper");

then define your file to be something like...


jQuery.sap.declare("zhcm.emp.mytimesheet.utils.ConnectionHelper");

jQuery.sap.require("hcm.emp.mytimesheet.utils.ConnectionHelper");

hcm.emp.mytimesheet.Service.prototype.showBusy = function(){

  alert("My showBusy");

}


Regards,

Jamie

SAP - Customer Experience Group

Former Member
0 Kudos

Hello Jamie,

                  My issue is still not solved. I am attaching component.js and the 2 ConnectionHelper.js files. Can you please tell me, where did I miss it?

I am trying to override function getCostAssignmentTypeListCollection of the original ConnectionHelper.

My application name is ZSOU, and I have kept the custom connectionhelper in its utils folder. Whenever I running the application now it results in a blank screen.

Please help me.

Best Regards

Soubhik

jamie_cawley
Advisor
Advisor
0 Kudos

Running the application in chrome, right click and choose inspect element and then select console.  After refreshing the app, what error shows?

Regards,

Jamie

SAP - Customer Experience Group

Former Member
0 Kudos

Hello,

         There is an error reported, which says that it is unable to load the connectionhelper.js file as it is not found. I am attaching the snapshot herewith.

Are we specifying the path wrong?

Best Regards

Soubhik

jamie_cawley
Advisor
Advisor
0 Kudos

How are you loading the application, launchpad sandbox or an index/main file?  Provide the details. 

It looks like the pathing to your component.js is incorrect which could be caused by how the app is being loaded, the structure of your application, or maybe you do not have the standard app defined as HCM_TS_CRE?  This is a case sensitive association.

Regards,

Jamie

SAP - Customer Experience Group

Former Member
0 Kudos

Hello,

          I have an index file (attached). I created the whole project in Eclipse with Fiori toolkit. So, I downloaded the standard app, then created SAP FIORI extension project, and then have been trying to add FIORI extensions in the extended project.

Initial project name: HCM_TS_CRE

Extended: ZSOM234

Normally my application is running, it is only when I try to override the ConnectionHelper.js file it is giving the blank screen. So the moment I comment the line jQuery.sap.require("hcm.emp.mytimesheet.ZSOM234.utils.ConnectionHelper"); it starts to work.

I am attaching all the relevant files below for your reference. Also I am attaching the Eclipse project structure snapshot.

Attachment: All files.txt (please rename it to all files.zip and then extract all of them)

Please help.

Best Regards

Soubhik

jamie_cawley
Advisor
Advisor
0 Kudos

The folder utils with the ConnectionHelper.js in it, needs to be under the WebContent folder.

Regards,

Jamie

SAP - Customer Experience Group

Former Member
0 Kudos

Hello,

           Thanks for your reply. I tried, so now utils is under Webcontent but it is still not working. You can check the error snapshot that I have attached.

Best Regards

Soubhik

jamie_cawley
Advisor
Advisor
0 Kudos

Did you fix the standard app too?  All of the js files/folders need to be in the WebContent folder.

Regards,

Jamie

SAP - Customer Experience Group

Former Member
0 Kudos

Hello,

         If I change the standard structure I am not able to submit it to the back end as it is trying to edit the standard application.

Every time I am submitting my changes to the gateway box so that the changes done in eclipse project structure gets reflected in the BSP application structure.

I am probably not getting your point, can you please explain.

Thanks a lot for your proactive support.

Best Regards

Soubhik

jamie_cawley
Advisor
Advisor
0 Kudos

From the last error it appears that it can not find the standard apps ConnectionHelper.  If you are testing this in eclipse its mostly caused by the standard apps structure in eclipse.

In eclipse all of the fiori application files should be within the WebContent folder.  I normally use the program /UI5/UI5_REPOSITORY_LOAD to download and upload the applications which allows you to pull down the files which you can then place into an empty ui5 project.  After your extension project is complete you can then use it to upload the contents found within your extension project webcontent folder.  

Regards,

Jamie

SAP - Customer Experience Group

Former Member
0 Kudos

Hello,

         I am not testing this from eclipse. I am uploading it from eclipse to the SAP backend and then testing it with the gateway system url in browser.

The funny thing is that although it is complaining about not finding standard app connectionhelper.js, the code runs fine when i am not trying to refedine connectionhelper with my custom one.

It is only when I write the jQuery.sap.require line in component.js that it gives me a blank screen.

For anything else it is running just fine. So you see it is able to find connectionhelper.js file of the standard one normally. Only when you try to override it, it shows this error.

Best Regards

Soubhik

jamie_cawley
Advisor
Advisor
0 Kudos

In se80 do you have a WebContent folder in your extension project?  If so try removing it from your project folder structure, so that all of the files/folder are directly under Page Fragments.

Regards,

Jamie

SAP - Customer Experience Group

Former Member
0 Kudos

Hello,

         Thanks for your help. In console I see that we have passed the error in that step. However now again we get the error that it is not able to locate component.js and connectionhelper.js in the console, but now the line of error reported is in the custom connectionhelper.js. The below lines throws the error.

hcm.emp.mytimesheet.utils.ConnectionHelper.getCostAssignmentTypeListCollection = function(f....

this is where we are overriding the function. Over here console throws the error that is is yet again unable to find component.js and connectionhelper.js

Thanks & Regards

Soubhik

jamie_cawley
Advisor
Advisor
0 Kudos

It also possible that your service for you app in SICF is defined in the wrong place.  It should be under

/default_host/sap/bc/ui5_ui5/sap/

Regards,

Jamie

SAP - Customer Experience Group

Answers (2)

Answers (2)

0 Kudos

Hi Pankaj,

I tried this code and it is not working.

Regards,

Puneet Jain

pankaj_bisht
Contributor
0 Kudos

Hi Soubhik,

There is an issue with the document that you are referring on Page 30.

Please find the updated code below.Please notice the changes in the declare and require.

Do let us know if this works.

  1. jQuery.sap.declare("cust.sd.sofulfil.monitor.utils.Formatter");

  1. cus.sd.sofulfil.monitor.utils.Formatter = {

formatIssueCode : function(issueCode) {

return "Hello SAP";

},

};

Below are the steps you need to follow

  1. 1. Insert the following piece of code in the Component.js file of the extension project

  1. jQuery.sap.require("cust.sd.sofulfil.monitor.utils.Formatter");

  1. 2. Create a new Formatter.js file in the utils folder of the extension project and insert the following lines of code

  1. jQuery.sap.require("sap.sd.sofulfil.monitor.utils.Formatter");
  2. jQuery.sap.declare("cust.sd.sofulfil.monitor.utils.Formatter");

  1. sap.sd.sofulfil.monitor.utils.Formatter.formatIssueCode = function(issueCode) {

return "Hello Customer";

};

Best Regards

Pankaj