Is there a way to change the visibility of widgets based on Button Click event?

[fcherkaoui]

I would like to show and hide widgets based on which button is clicked. Is there a way currently to bind the click of a button to the "Visible" attribute of another widget (such as a map for instance) ?

[Aanjan]

Fatima, 'Visible' is a boolean property, and buttons work based on 'clicked' events. What you would need to do is write a service which outputs true or false as results based on its execution. You would need to bind this service output to the visible property, and bind the button click to this service. Each time you click the button, this service will get executed, sending true or false (show or hide) to the visible property.

[fcherkaoui]

Thank you Anjan for your reply!

However, I am also trying to toggle the visibility based on multiple buttons click events. For instance button1 clicked --> show element A and hide Element B and Button 2 clicked --> hide Element A and show Element B.

The visibility attribute only takes one biding and I am not able to use the visibility attribute as an input to service.

Is there a way to toggle the visibility similar to an (ng-show or ng-if) in AngularJS.

[ptc-6292103]

Maybe you can have a Service which outputs an InfoTable with a DataShape of two booleans (one for each element). The input is the current state of the two elements. Each button which should toggle the visibility can invoke the same Service.

[msakshi1]

Hatcher Chad​ Aanjan Ravi​

Can i get this service, even i am working on the similar thing but not able to figure out what i am missing out in service.

I have created an infotable, created data shape as well which has three field definition so, how is that we can toggle these three button. On clicking of A, B should appear and A & C should disappear, similarly on clicking of B, C should appear and B & A should disappear and finally on clicking of C, A should appear and B & C should disappear

So, it would be really helpful if i could get this service.

[ptc-6292103]

I haven't tested this, but it should get you in the right direction.

Service input would be like:

- (BOOLEAN) active_A - bound from the current 'Visible' state of Button A.

- (BOOLEAN) active_B - bound from the current 'Visible' state of Button B.

- (BOOLEAN) active_C - bound from the current 'Visible' state of Button C.

Service script would be like:

var result = Resources.InfoTableFunctions.CreateInfoTableFromDataShape({ infoTableName : "InfoTable", dataShapeName : "YOUR_DATASHAPE_NAME" });
result.active_A = active_C; // Button A should be enabled after Button C is clicked.
result.active_B = active_A; // Button B should be enabled after Button A is clicked.
result.active_C = active_B; // Button C should be enabled after Button B is clicked.

Service output would be like:

- result.AllData.active_A is bound to 'Visible' state of Button A.

- result.AllData.active_B is bound to 'Visible' state of Button B.

- result.AllData.active_C is bound to 'Visible' state of Button C.

Service invocation would be on:

- Button A clicked event.

- Button B clicked event.

- Button C clicked event.

Depending on the initial states of the buttons, you might have to change the script to be like:

result.active_A = !active_A && !active_B;
result.active_B = !active_B && !active_C;
result.active_C = !active_C && !active_A;

or

result.active_A = active_C && !active_A;
result.active_B = active_A && !active_B;
result.active_C = active_B && !active_C;

[msakshi1]

Aanjan Ravi​

Can i get this service, even i am working on the similar thing but not able to figure out what i am missing out in service.

So, it would be really helpful if i could get this service and proceed.