Skip to Content
avatar image
Former Member

Change layout of FilterBar having Variant and SearchField in the FilterBarToolbar

Hello guys,

Please help me regarding the following topic.

I have an UI5 application using rest services, but no OData.

I am using the FilterBar with the VariantManagement and a SearchField.

When displaying the application the Variant and SearchField will be displayed below the FilterBar.

However the requirement is to have these both within the FilterBarToolbar, which is the case when using the SmartFilterBar with OData.

See view1.xml

showClearButton="true"  >
		<v:VariantManagement id="filterBarVariantManagement" select="onSelect" save="onSave" enabled="true" manage="onManage" showExecuteOnSelection="true" showShare="true">
				<v:VariantItem text="My Global Variant" key="MGV" global="true" readOnly="false" lifecyclePackage="$TMP"/>
				<v:VariantItem text="My Better Variant" key="MBV" global="false" readOnly="false" lifecyclePackage="$TMP"/>
		<SearchField id="filterBarSearchField" showSearchButton="true" search="onSearch" ></SearchField>
			<fb:FilterItem id="F1" name="F1" label="Filter1" >
					<Input type="Text" change="onChange"/>

What i now did is within the controller event: onAfterRendering I used JQuery to put the Variant container and SearchField container before the FilterBarToolbar.


onAfterRendering: function() {

This works fine when starting the application.

However when pressing the button "Hide Filter Bar" and after "Show Filter Bar" the FilterBar will be removed and added to the nodes. This leads to the situation that the Variant and SearchField are displayed again below the whole FilterBar.

What can i do to move (Variant and SearchField) again inside the FilterBarToolbar ?

When trying to react on changes of the FilterBar my JQuery manipulations will be overriden by the sap-ui-core. I guess my dom manipulation are to early in this case.

Please help me.



Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

0 Answers