Skip to Content
Author's profile photo Sri Divya

OData binding to a table in XML Fragment in SAP UI5

OData model is a server-side model, so entire data is available at the server side. The client side can see only rows and fields and you can’t use sorting and filtering at the client side. There is a need to send a request to the server to complete these tasks.

Fragments are light-weight UI parts which can be reused, defined similar to views, but the definition of the controller is absent as they don’t have controllers.

They can be reused and if source code is required for event handler methods, they can connect to existing controllers of the view which they are part of.

Data source creation:
Create a new data source in the descriptor editor of manifest.json by hitting a plus button.

Now select a system from destinations you already added in the HANA cockpit from the drop down and also select corresponding service name as shown below.

Click on next and then Finish.
Model creation:
In order to access the data in the data source we create a model in the descriptor. Create a model by hitting on plus button in the descriptor editor of manifest.json file.

Now provide a model name and select a data source. Click on ok.

view1.view.xml: In the view, define a fragment as shown below.

<mvc:View controllerName="manifest.controller.View1" xmlns:html="" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:core="sap.ui.core">
	 <core:Fragment   fragmentName="manifest.view.HelloDailog" type="XML" />

we will define only the fragment assets and no controller as fragments won’t have controllers in the fragment core. We defined a table here as follows.

<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core">	
		 	<Table id="producttable" items="{/user_detailsSet}">
				<Text text="Name" />
				<Text text="City" />
									<Text text="{Name}"/>
									<Text text="{City}"/>


Here we are instantiating the fragment by calling sap.ui.xmlfragment method by defining the fragment path.

In the onInit function, we are going to access the table which we have created in the fragment by it’s Id and will create a column list item having two cells to bind the items of the table later.

		onInit: function() {
			var oView = this.getView();
		// create dialog via fragment factory
		var oDialog = sap.ui.xmlfragment( "manifest.view.HelloDailog");
		//Accessing the table from the fragment by it's Id	
			var oTable = this.byId("producttable");
		//column list item creation
			var oTemplate = new sap.m.ColumnListItem({
				cells: [new sap.m.Text({
					text: "{Name}"
				}), new sap.m.Text({
					text: "{City}"
			var sServiceUrl = "/sap/opu/odata/sap/ZUSER_DETAILS_88_SRV";
		//Adding service to the odata model
			var oModel = new sap.ui.model.odata.ODataModel(sServiceUrl, false);
		//Setting model to the table
			oTable.bindAggregation("items", {
				path: "/user_detailsSet",
				template: oTemplate


The output is as follows:


Assigned Tags

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

      Hi Sri Divya,

      In the above example since you have already done the binding of items in he XML, why do we need to bind items again in the controller?

      Actually I was trying the same thing, when I bind items to the table in XML, it gives error "Missing template or factory function for aggregation items of Element sap.m.Table#attributeTable3 !".

      If i do it using controller, it works.

      But I want to do it in XML only, do you have any idea why items binding is not working in XML.

      Kind regards,


      Author's profile photo Somnath Choudhury
      Somnath Choudhury

      Simple yet Useful Blog. Hi Nishit the whole idea of MVC is to seperate the view from the controller . Why at first you need to bind inj View level in XML . The Binding will happen in controller , XML View will present to the user. This is an example of how to use Fragments what you can do is to simply remove the <items> aggregation from the View and adjust the same in VIEW controller as apart from this XML view is only displaying the colomn name and text . The data coming from Odata source will be binded ti the view in view1.controller.js.





      Author's profile photo Eyüp Önder
      Eyüp Önder

      Thanks, Sri Divya

      very useful content ?
      Author's profile photo Sri Divya
      Sri Divya
      Blog Post Author

      Thank you

      Author's profile photo achraf elmsieh
      achraf elmsieh

      thank  you

      Author's profile photo Sri Divya
      Sri Divya
      Blog Post Author


      Author's profile photo Ashok Pappu
      Ashok Pappu

      Without fragment factory also we can bind ...

      var oTable = this.byId("producttable");

      Just change it simply as ...

      var oTable  = sap.ui.getCore().byId("producttable");