Hi All,
I am using WEBIDE trail version, I have 2 models in my Manifest.json, And I would like to display 2 tables in my View1.js. My first Model is set as default model, and second Model is named as Model2. I am able to access the default model in the View1.js and able to diaply my first table. But when I am trying to access the second model ( Model2 ) data is not getting displayed in the table, But i can see empty rows ( an indication that the records are some how populated But may be i am doing some thing wrong).
Please find my Manifest.Json and also code in the View1.js
{ "_version": "1.7.0", "sap.app": { "id": "ZTEST_WITH_MODELS", "type": "application", "i18n": "i18n/i18n.properties", "applicationVersion": { "version": "1.0.0" }, "title": "{{appTitle}}", "description": "{{appDescription}}", "sourceTemplate": { "id": "servicecatalog.connectivityComponent", "version": "0.0.0" }, "dataSources": { "services.xsodata": { "uri": "/live4/live4/services.xsodata/", "type": "OData", "settings": { "odataVersion": "2.0", "localUri": "localService/metadata.xml" } }, "Northwind.svc": { "uri": "/Odata/V2/Northwind/Northwind.svc/", "type": "OData", "settings": { "odataVersion": "2.0", "localUri": "localService/Northwind.svc/metadata.xml" } } } }, "sap.ui": { "technology": "UI5", "icons": { "icon": "", "favIcon": "", "phone": "", "phone@2": "", "tablet": "", "tablet@2": "" }, "deviceTypes": { "desktop": true, "tablet": true, "phone": true }, "supportedThemes": ["sap_hcb", "sap_belize"] }, "sap.ui5": { "rootView": { "viewName": "ZTEST_WITH_MODELS.view.View1", "type": "JS" }, "dependencies": { "minUI5Version": "1.30.0", "libs": { "sap.ui.core": {}, "sap.m": {}, "sap.ui.layout": {}, "sap.ushell": {}, "sap.collaboration": {}, "sap.ui.comp": {}, "sap.uxap": {} } }, "contentDensities": { "compact": true, "cozy": true }, "models": { "i18n": { "type": "sap.ui.model.resource.ResourceModel", "settings": { "bundleName": "ZTEST_WITH_MODELS.i18n.i18n" } }, "": { "type": "sap.ui.model.odata.v2.ODataModel", "settings": { "defaultOperationMode": "Server", "defaultBindingMode": "OneTime", "defaultCountMode": "Request" }, "dataSource": "services.xsodata", "preload": true }, "Model2": { "type": "sap.ui.model.odata.v2.ODataModel", "settings": { "defaultOperationMode": "Server", "defaultBindingMode": "OneTime", "defaultCountMode": "Request" }, "dataSource": "Northwind.svc", "preload": true } }, "resources": { "css": [{ "uri": "css/style.css" }] } } }
sap.ui.jsview("ZTEST_WITH_MODELS.view.View1", { /** Specifies the Controller belonging to this View. * In the case that it is not implemented, or that "null" is returned, this View does not have a Controller. * @memberOf controller.View1 */ getControllerName: function() { return "ZTEST_WITH_MODELS.controller.View1"; }, /** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed. * Since the Controller is given to this method, its event handlers can be attached right away. * @memberOf controller.View1 */ createContent: function(oController) { /* //---------------table1 with default Model-------------------------------- //------------table1 code is commenetd------------------------- var oTable = new sap.m.Table("idPrdList", { inset: true, headerText: "List of Products", headerDesign: sap.m.ListHeaderDesign.Standard, mode: sap.m.ListMode.None, includeItemInSelection: false, }); var col1 = new sap.m.Column("col1", { header: new sap.m.Label({ text: "Product Name" }) }); oTable.addColumn(col1); var col2 = new sap.m.Column("col2", { header: new sap.m.Label({ text: "Description" }) }); oTable.addColumn(col2); var col3 = new sap.m.Column("col3", { header: new sap.m.Label({ text: "Price" }) }); oTable.addColumn(col3); var colItems = new sap.m.ColumnListItem("colItems", { type: "Active" }); oTable.bindAggregation("items", "/Products", colItems); var txtNAME = new sap.m.Text("txtNAME", { text: "{ProductID}" }); colItems.addCell(txtNAME); var txtNAME2 = new sap.m.Text("txtNAME2", { text: "{Name}" }); colItems.addCell(txtNAME2); var txtNAME3 = new sap.m.Text("txtNAME3", { text: "{Price}" }); colItems.addCell(txtNAME3); //----------------Table1 ends -------------------------------------------- //---------Table1 code commented ends---------------------------------- */ //-------------------Table2 starts------------------------------------ var oTable2 = new sap.m.Table("idCatList", { inset: true, headerText: "List of Cat Categories", headerDesign: sap.m.ListHeaderDesign.Standard, mode: sap.m.ListMode.None, includeItemInSelection: false, }); var col4 = new sap.m.Column("col4", { header: new sap.m.Label({ text: "CategoryID" }) }); oTable2.addColumn(col4); var col5 = new sap.m.Column("col5", { header: new sap.m.Label({ text: "CategoryName" }) }); oTable2.addColumn(col5); var col6 = new sap.m.Column("col6", { header: new sap.m.Label({ text: "Description" }) }); oTable2.addColumn(col6); // debugger; // var oModel = sap.ui.getCore().getModel("Model2"); // var oModel2 = this.getOwnerComponent().getModel(); var colItems = new sap.m.ColumnListItem("colItems", { type: "Active" }); oTable2.bindAggregation("items", "Model2>/Categories", colItems); var txtNAME4 = new sap.m.Text("txtNAME4", { text: "{CategoryID}" }); colItems.addCell(txtNAME4); var txtNAME5 = new sap.m.Text("txtNAME5", { text: "{CategoryName}" }); colItems.addCell(txtNAME5); var txtNAME6 = new sap.m.Text("txtNAME6", { text: "{Description}" }); colItems.addCell(txtNAME6); debugger; var oPage = new sap.m.Page({ title: "{i18n>title}", content: [oTable2] }); var app = new sap.m.App("myApp", { initialPage: "oPage" }); app.addPage(oPage); return app; } });
Note : if I switch the Model2 to default Model, I can see the data in the View instaed of empty rows with same code,But just by changing
oTable2.bindAggregation("items", "/Categories", colItems); instaed of oTable2.bindAggregation("items", "Model2>/Categories", colItems);
I am using North wind service for my Model2 http://services.odata.org/V2/Northwind/Northwind.svc/Categories?$format=json