Hiding UI element from fragment.xml in standard App

Hi All.,

            I wanted to hide few UI element from My Travel and Expense (Standard App). I have tried in different approaches but am not able to achieve what i want. Here is my requirement,

In My Travel and Expense App(TRV_TE_CRE), Want to hide the following UI elements

Here is the XML file and id of the field

GenericClaim.fragment.xml - Button id="costAssignmentButton"

I have added the extension project for TRV_TE_CRE and tried as below,

1. In component.js added the following statement to hide

customizing: {

       "sap.ui.viewModifications": {
         "mytravelandexpense.view.GenericClaim": {
           "costAssignmentButton": {
             "visible": false
           },
         },
       },

Result: not working

2. Extended the GenericClaim.controller.js

Added the below code in hookmethod

this.byFragmentId("costAssignmentButton").setVisible(false);

Result : whole claim page is not loading

3. by using access key I have commented the UI code in GenericClaim.fragment.xml

Result : not getting hide

anything I missed ? anyone please help me to fix this

regards,

Mahi