It does not work sap.ui.jsfragment.

[Former Member]

Hi! (Sorry for the previous post)

I can not use 'jsfragment'. I do not understand why. I'm trying to do everything as follows:

I have a basic view (xml). It posted an internal view ...

FormGoals.view.js

...
<mvc:XMLView viewName="sap.ui.x5.forms.view.MonoTable_Main" id="mono_table_main" async="false"></mvc:XMLView>
...

This is an additional view (xml). In it, I'm trying to build fragment (js):

MonoTable_Main.view.xml

<mvc:View
  height="100%"
  controllerName="sap.ui.x5.forms.controller.MonoTable"
  xmlns:mvc="sap.ui.core.mvc"
  xmlns:l="sap.ui.layout"
  xmlns="sap.m">
  <l:VerticalLayout
     id="MonoTable_Main_Content" 
     class="sapUiSmallMargin" >
     <l:content>
         <Text text="Вертикальная область..." />
     </l:content>
  </l:VerticalLayout>
</mvc:View>

MonoTable_Edit.fragment.js

sap.ui.jsfragment("sap.ui.x5.forms.view.MonoTable_Edit", {
  createContent: function(oController){
  var oText = new sap.m.Text({
  text: "Hello World!!!"
  });
  return oText;
  } 
});

This controller is an additional view:

FormGoals.controller.js

sap.ui.define([
  'jquery.sap.global',
  'sap/m/MessageToast',
  'sap/ui/core/Fragment',
  'sap/ui/core/mvc/Controller',
  'sap/ui/model/json/JSONModel'
], function(jQuery, MessageToast, Fragment, Controller, JSONModel) {
  "use strict";

  var FormGoalsController = Controller.extend("sap.ui.x5.forms.controller.FormGoals", {


  onInit: function (oEvent) {
  this._showViewFragment("MonoTable_Edit");
  },

  _formFragments: {},

  _getFormFragment: function (sFragmentName) {
  var oFormFragment = this._formFragments[sFragmentName];


  f (oFormFragment) {
  return oFormFragment;
  }

  oFormFragment = sap.ui.jsfragment(this.getView().getId(), "sap.ui.x5.forms.view." + sFragmentName);
  return this._formFragments[sFragmentName] = oFormFragment;
  },

  _showViewFragment: function(sFragmentName) {
  var oLayout = this.getView().byId("MonoTable_Main_Content");

  oLayout.removeAllContent();
  oLayout.insertContent(this._getFormFragment(sFragmentName));
  }

  });
  return FormGoalsController;
});

If you use the view XML, everything works, but I need it JS.

Tell me, please, what am I doing wrong?

[saivellanki · Accepted solution]

Hi Sergey,

Did you check this sample? Example: JS Fragments Used in XML Views - UI Development Toolkit for HTML5 (SAPUI5) - SAP Library

and this as well - Programmatically Instantiating JS Fragments - UI Development Toolkit for HTML5 (SAPUI5) - SAP Librar...

Regards,

Sai Vellanki.

[Former Member]

Thanks to everyone who tried to help!

I found the solution to my problem. The thing is that I used the wrong constructor method "sap.ui.jsfragment ()". Namely, in the method "getFromFragment".

The final decision as follows:

1. The main perspective I connect an embedded view.

Main.view.xml

...
<mvc:XMLView viewName="sap.ui.....forms.view.MonoTable_Main" id="mono_table_main" async="false"></mvc:XMLView>
...

2. Nested view is very simple: it contains only VerticalLayout a mandatory attribute 'id'.

MonoTable_Main.view.xml

<mvc:View
  height="100%"
  controllerName="sap.ui.....forms.controller.MonoTable"
  xmlns:mvc="sap.ui.core.mvc"
  xmlns:l="sap.ui.layout"
  xmlns="sap.m">
  <l:VerticalLayout
     id="MonoTable_Layout"
     class="sapUiSmallMargin" >
     <l:content>
         <Text text="Text in VIEW..." />
     </l:content>
  </l:VerticalLayout>
</mvc:View>

3. Fragment is also very simple.

MonoTable_Read.fragment.js

sap.ui.jsfragment("sap.ui.....forms.view.MonoTable_Read", {
  createContent: function(oController){
  var oText = new sap.m.Text({
  text: "Text in FRAGMENT..."
  });
  return oText;
  }
});

4. Now the most important thing.

MonoTable.controller.js

sap.ui.define([
  'jquery.sap.global',
  'sap/m/MessageToast',
  'sap/ui/core/Fragment',
  'sap/ui/core/mvc/Controller',
  'sap/ui/model/json/JSONModel'
], function(jQuery, MessageToast, Fragment, Controller, JSONModel) {
  "use strict";

  var MonoTableController = Controller.extend("sap.ui.....forms.controller.MonoTable", {

  onInit: function() {
  this._showFormFragment("MonoTable_Read");
  },


  _formFragments: {}, //An associative array of fragments.

  _getFormFragment: function (sFragmentName) {
  var oFormFragment = this._formFragments[sFragmentName];


  if (oFormFragment) {
  return oFormFragment;
  }


  oFormFragment = sap.ui.jsfragment("sap.ui.....forms.view." + sFragmentName, this);


  return this._formFragments[sFragmentName] = oFormFragment;
  },

  _showFormFragment: function(sFragmentName) {
  var oLayout = this.getView().byId("MonoTable_Layout");

  oLayout.removeAllContent();
  oLayout.insertContent(this._getFormFragment(sFragmentName));
  },

  });

  return MonoTableController;
});

I hope this is useful to someone ...

Good luck in the development SAPUI5!

[former_member182372]

do you see your content in ctr+shft+alt+s -> Control tree?

any errors in console?

so you just dont see that control, right?