Skip to main content
Answered

Trigger for custom form elements.

  • May 20, 2022
  • 1 reply
  • 86 views

Hi all,

I want to attach a step to the custom dropdown form element. But because it's not an HTML SELECT element (I use ng-select), I can't use standard triggers for tour advance.

  1. "Click on the element" is not suitable, because when clicked the user jumps to the next step without possibility to select any dropdown option.
  2. "Fill in the field" opens dropdown but does not respond to option selection. Plus, options are overlapped by the tour's backdrop.
  3. "Next or Done button" blocks dropdown at all. User can't interact with it.

 

Is there any standard solution for such custom form elements? Or what would you suggest to me for this case?

Best answer by Aparna

Hey @andriy o​! When it comes to drop-down menus they usually don't work well with our Product Tours. It can depend on how the dropdown is designed and implemented on your website. Product Tour depends on CSS Selectors, any elements that are hidden, e.g. options in the dropdown menu, will not be targetable by the tour. In general, I've found the best approach for dealing with a drop-down in a tour is to think of it as multiple steps.

  1. Click on the dropdown menu
  2. Click on the element in the dropdown menu

 

Here is an article in relation to how to manually edit select a CSS selector. Just to let you know that to investigate an issue related to tour we need more information like link to the tour, your website URL, test user credentials etc. So I would suggest you opening a chat with our support team if further investigation is needed.

 

 

View original
Did this topic help you find an answer to your question?

1 reply

  • Employee
  • 328 replies
  • Answer
  • May 27, 2022

Hey @andriy o​! When it comes to drop-down menus they usually don't work well with our Product Tours. It can depend on how the dropdown is designed and implemented on your website. Product Tour depends on CSS Selectors, any elements that are hidden, e.g. options in the dropdown menu, will not be targetable by the tour. In general, I've found the best approach for dealing with a drop-down in a tour is to think of it as multiple steps.

  1. Click on the dropdown menu
  2. Click on the element in the dropdown menu

 

Here is an article in relation to how to manually edit select a CSS selector. Just to let you know that to investigate an issue related to tour we need more information like link to the tour, your website URL, test user credentials etc. So I would suggest you opening a chat with our support team if further investigation is needed.

 

 


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings