How to add Buttons inside Smart Table Tool bar

[Former Member]

Hi All

I am facing issue in adding buttons inside the smart Table tool bar using XML. which is shown in the below picture and I want to add buttons in the highlighted area ( Edit, Copy and Delete should go down)

I have attached the code also below.

<OverflowToolbar class="sapUiMediumMarginTop">

  <ToolbarSpacer width="1000px"/>

  <Button text="Edit"/>

  <Button text="Copy"/>

  <Button text="Delete"/>

  </OverflowToolbar>

  <smartTable:SmartTable id="LineItemsSmartTable" entitySet="LineItemsSet" smartFilterId="smartFilterBar"

  tableType="Table"

  editable="true"

  useVariantManagement="true"

  useExportToExcel="true"

  useTablePersonalisation="true" header="Items" showRowCount="true"

  persistencyKey="SmartTableAnalytical_Explored" enableAutoBinding="true">

  <!-- layout data used to make the table growing but the filter bar fixed -->

  <smartTable:layoutData>

  <FlexItemData growFactor="1"/>

  </smartTable:layoutData> 

  </smartTable:SmartTable>

Can anyone please help me to resolve this issue?

[former_member227538]

Do this first:

var oTable = this.getView().byId("<yourSmartTableId>").getTable(); //this will give you  the table reference

var oToolbar = oTable.getHeaderToolbar(); //this 'should' give you the reference to the toolbar.

now you can add controls.

oToolbar.addContent(oControllerYouNeedObject);

I haven't tried this. Just try it and let me know if it works. If it doesn't post an image of any error that you notice.
You can also try getting the toolbar reference by ID during run time. Check out my previous answer.

[former_member131774]

Hi Tejas,

I found solution is to use customToolbar tag in xml view.

Please see detail coding above.

Best regards,

Vincent

[former_member227538]

Hi I found a way to achieve this:

you have to add the following code in your oninit function after binding the model to the smart table:

var toolBar = sap.ui.getCore().byId("__toolbar3");

toolBar.addContent(new sap.m.Button({text: "Refresh"}));

Te Id of the toolbar is not dynamic. However, the Id(__toolbar3) might change between snapshots. So you better find the Id by doing inspect element on the toolbar before you implement this. If you have any doubts get back to me. Good luck.

Regards,

Tejas Sastry

Message was edited by: Tejas S. Gargeya Sastry

[former_member131774]

Hi ,

You need to add coding like below.

Best regards,

Vincent

 <st:SmartTable id="objectList"
 useOnlyOneSolidToolbar="true" enableAutoBinding="true"
 showRowCount="true" tableType="ResponsiveTable" useExportToExcel="false"
 useTablePersonalisation="true"
 header="{path: 'header>TypeNamePlural', formatter: 'sap.ui.model.odata.AnnotationHelper.format'}"
 entitySet="{parameter>/entitySet}" beforeRebindTable="onBeforeRebindTable">
 <st:customToolbar>
 <Toolbar>
 <ToolbarSpacer />
 <template:repeat list="{meta>com.sap.vocabularies.UI.v1.LineItem}"
 var="lineitem">
 <template:if
 test="{= ${lineitem>RecordType} === 'com.sap.vocabularies.UI.v1.DataFieldForAction'}">
 <Button
 text="{path: 'lineitem>Label', formatter: 'sap.ui.model.odata.AnnotationHelper.format'}"
 press="onCallAction">
 <customData>
 <core:CustomData key="STFunction"
 value="{path: 'lineitem>Action', formatter:'sap.ui.model.odata.AnnotationHelper.format'}" />
 </customData>
 </Button>
 </template:if>
 </template:repeat>
 </Toolbar>
 </st:customToolbar>
 <Table fixedLayout="false" growing="true" growingThreshold="50"
 mode="{= ${path: 'meta>com.sap.vocabularies.UI.v1.LineItem', formatter: 'TemplateObjectList.ObjectListAnnotationHelper.hasActions'} 
 ? 'SingleSelectLeft' : 'None' }">
 <ColumnListItem
 type="{path: 'meta>com.sap.vocabularies.UI.v1.LineItem', formatter: 'TemplateObjectList.ObjectListAnnotationHelper.fillPreprocessorsData'}"
 press="onListNavigate" />
 </Table>
 </st:SmartTable>

[former_member227538]

Can you please post a screenshot of the UI which this code yields?