Highlighted

Enforcing button clicking order

New Here ,
Jan 18, 2019

Copy link to clipboard

Copied

Hello,

I am trying to create an alternative for a drag and drop interaction. Instead of dragging items and then dropping them in the correct order, I want users to click the items off to the left and then appear off to the right in the correct order.

I have achieved this so far by using transparent buttons over my images on the left and hiding the images on the right and then executing an advanced action to show the image on the right once the corresponding button is clicked.

Now I am trying to figure out a way to enforce the clicking order of the buttons. For example if the user clicks an image out of order, it will not appear to the right. The user would have to keep clicking buttons on the left in order to find the correct order for the images to appear on the right.

Does anyone have any suggestions on how to do this?

Thank you

The simplest approach would be to disable the clickable buttons and only enable the next button in series when a correct button is clicked. There should not be any need to use transparent buttons - use image buttons instead.

On Enter - disable all buttons except the first in the series and hide all images on the right

Each button - a shared action that:

1. Shows the corresponding image on the right

2. Enables the next button in the series

3. Disables or hides the button that was just clicked (to prevent repeat clicking)

Views

152

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Enforcing button clicking order

New Here ,
Jan 18, 2019

Copy link to clipboard

Copied

Hello,

I am trying to create an alternative for a drag and drop interaction. Instead of dragging items and then dropping them in the correct order, I want users to click the items off to the left and then appear off to the right in the correct order.

I have achieved this so far by using transparent buttons over my images on the left and hiding the images on the right and then executing an advanced action to show the image on the right once the corresponding button is clicked.

Now I am trying to figure out a way to enforce the clicking order of the buttons. For example if the user clicks an image out of order, it will not appear to the right. The user would have to keep clicking buttons on the left in order to find the correct order for the images to appear on the right.

Does anyone have any suggestions on how to do this?

Thank you

The simplest approach would be to disable the clickable buttons and only enable the next button in series when a correct button is clicked. There should not be any need to use transparent buttons - use image buttons instead.

On Enter - disable all buttons except the first in the series and hide all images on the right

Each button - a shared action that:

1. Shows the corresponding image on the right

2. Enables the next button in the series

3. Disables or hides the button that was just clicked (to prevent repeat clicking)

Views

153

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Most Valuable Participant ,
Jan 19, 2019

Copy link to clipboard

Copied

I have developed similar use cases for clients, am sure to be able to get this done. However, it would take me too much time which I cannot afford. You have to be very familiar with creating either shared/advanced actions of JS. Crossing my fingers that someone will be helping you. Sorry.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Engaged ,
Jan 21, 2019

Copy link to clipboard

Copied

The simplest approach would be to disable the clickable buttons and only enable the next button in series when a correct button is clicked. There should not be any need to use transparent buttons - use image buttons instead.

On Enter - disable all buttons except the first in the series and hide all images on the right

Each button - a shared action that:

1. Shows the corresponding image on the right

2. Enables the next button in the series

3. Disables or hides the button that was just clicked (to prevent repeat clicking)

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
New Here ,
Jan 21, 2019

Copy link to clipboard

Copied

Thank you, I was definitely over thinking that, I appreciate your simplistic approach! 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Resources
Captivate User Guide
New Group