Hi Everyone,
I am working on SAPUI5 Application development. I am using MultiInstance(Tab Container) in my application. In my first view i have a sap.ui.table with selection. if user select single item from the table,it should open the Tab container. Inside the TabContainer i should have selected table item(another table).
For each table selected,i associated with two other collections(via association and navigation in OData). So in my TabContainer, in each tab i have a name and associated collections in grid table. it is also a table with selection.
But the selection property for the item table not working. I followed the below question,
SCN Question regarding it: Quetion
"It looks like the option to set or edit the content inside the Tab container is affected by the items set to the container.
When, I tried the code, I found that table works with tab container BUT no items should be set to the container. Once items are set, the default behavior of table is lost."
I tried the same scenatio in sapui5 sample app by binding two diff collections.
//SAPUI5 Sample application: Application
link:
By Default, the above application loaded with below model,
var oModel = new JSONModel(sap.ui.require.toUrl("com/zcombo_box_test/localService/mockdata") + "/products.json"); this.oView.setModel(oModel);
i added new model for the table inside the tab container:
var oSalesOrderModel = new JSONModel(sap.ui.require.toUrl("com/zcombo_box_test/localService/mockdata") + "/SalesOrder.json"); this.oView.setModel(oSalesOrderModel, "salesorder");
TableController call Code :
TCController.prototype.openSelectedItems = function () { var oTabContainer, oTabContainerItemsTemplate, aFilters = [], aSelectedRows = this.oPageTable.getSelectedContexts(); this.oNavCon.to(this.oPageTabContainer); aSelectedRows.forEach(function (oRow) { aFilters.push(new Filter("ProductId", FilterOperator.EQ, oRow.getProperty("ProductId"))); }); oTabContainerItemsTemplate = new TabContainerItem({ name: "{Name}", content: [ this._getFragment("Display") ] }); oTabContainer = new TabContainer({ showAddNewButton: true, items: { path: '/ProductCollection', filters: aFilters, template: oTabContainerItemsTemplate } }); this.oPageTabContainer.insertContent(oTabContainer); };
it will call the Display Fragment code:
Display.Fragment.xml:
<core:FragmentDefinition xmlns="sap.m" xmlns:ui="sap.ui.table" class="sapUiSizeCompact" xmlns:l="sap.ui.layout" xmlns:core="sap.ui.core"> <l:VerticalLayout class="sapUiContentPadding"> <Panel expanded="true" expandable="true"> <headerToolbar> <OverflowToolbar height="3rem"> <Title text="GroupElementList"/> <ToolbarSpacer/> <Button icon="sap-icon://add" press="onCreateGroupElementFragment"/> <Button icon="sap-icon://delete" press="onDeleteGroupElement"/> </OverflowToolbar> </headerToolbar> <content> <ui:Table rows="{salesorder>/SalesOrderCollection}" title="SalesOrderCollection" selectionMode="MultiToggle" visibleRowCount="7" paste="onPaste"> <ui:columns> <ui:Column width="11rem"> <Label text="SoId"/> <ui:template> <Text text="{salesorder>SoId}" wrapping="false"/> </ui:template> </ui:Column> <ui:Column width="11rem"> <Label text="CreatedByBp"/> <ui:template> <Input value="{salesorder>CreatedByBp}"/> </ui:template> </ui:Column> <ui:Column width="6rem" hAlign="End"> <Label text="ChangedByName"/> <ui:template> <Label text="{salesorder>ChangedByName}"/> </ui:template> </ui:Column> </ui:columns> </ui:Table> </content> </Panel> </l:VerticalLayout> </core:FragmentDefinition>
After this code, i can see the Initial tbale and tab container screen , and able select the table rows inside the tab container.
But In my approach , i followed the same approach the selection is not working inside the tab container.
Please if anyone know the solution, please help me to sort it out.
Thank you,
Regards,
JK.