Skip to Content
0

Disable page footer buttons or footer for one particular icontabfilter ..

Jan 19, 2017 at 07:10 AM

251

avatar image
Former Member

Hi All,

In detail screen, I have placed a footer with "cancel" and "submit" buttons.

I need to display this footer only for one icon tab filter and disable the footer or buttons for other two icon tab filters.

How do i do that?

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

2 Answers

VIPLOVE KHUSHALANI Jan 19, 2017 at 07:53 AM
0

Hi Lalitha ,

You need to do this in the "select" event of icon tab bar

View (XML):

<Page id="page">

<IconTabBar

id="idIconTabBar"

select="handleIconTabBarSelect"

> ...........

</IconTabBar>

<footer>

<Toolbar enabled = {footer>enable}>

<ToolbarSpacer/>

<Buttontext="Accept"type="Accept"/>

<Buttontext="Reject"type="Reject"/>

<Buttontext="Edit"/>

<Buttontext="Delete"/>

</Toolbar>

</footer>

</Page >

controller (JS):

handleIconTabBarSelect :function(oEvent){

var skey = oEvent.getParameter("key"); //getting selected IconTabfilter key

if (key = "<hidefilterkey>") // compares with the key of IconTabfilter where you want to disable the footer

{

//here you need to disable the footer , you can disable it in two ways one is to get the footer Toolbar by Id and set enabled property false //(.setEnabled(false)) and second way is through binding (attaching model to enabled property of the footer toolbar) and change the enabled //property bind value to false

this.toggleFooterToolbar(false); // second way

}

else

{

/here you need to enable the footer , you can enable it in two ways one is to get the footer Toolbar by Id and set enabled property true //(.setEnabled(true)) and second way is through binding (attaching model to enabled property of the footer toolbar) and change the enabled //property bind value to true

this.toggleFooterToolbar(true);// second way

}

},

toggleFooterToolbar:function(value) {

var enable = {enable :value};

var model = new sap.ui.model.json.JSONModel();

model.setData(enable);

this.getView().byId("page").setModel(model,"footer");

this.getView().byId("page").bindElement("footer>/");

}

thanks

Viplove

Show 3 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi ,,

Thanks for the code.

How to keep my buttons on the right corner of the toolbar?/

0

Hi,

you just need to put one toolbar spacer before your buttons, like below:

<OverflowToolbar>
<ToolbarSpacer/>
<Button text="Edit" />
<Button text="Cancel" />
</OverflowToolbar>

Regards,Akhilesh

0
Former Member
Akhilesh Upadhyay

Thank you. It's working now.

0
avatar image
Former Member Jan 19, 2017 at 08:52 AM
0

The best way to control UI is binding.

If you have a model, property that is define a behavior of buttons.

It is very easy to hide or show your buttons.

Bind it to the property 'visible' of button,and add some formatter or expression binding.

Share
10 |10000 characters needed characters left characters exceeded