Open survey through a method call

ThumbsUp Survey • June 3, 2024 • 1 week ago

By default, using a survey is pretty simple: just add the tag provided in the builder and call the js file. We will do all the rest.

But, there are other options as well, like opening the survey after a click or, if you’re a Javascript geek, by using a method call. Let’s see how we can do this!

So, let’s grab an example[1], the demo survey we have in the homepage. By default, we see the following options:

On the top right corner, there’s a small switch; this way you will enable the extra options:

As you can see, there are new options here, open the survey through a method call or a click event. Let’s take them one by one:

How to open a survey through a method call

As soon as you click on the “through a method call”, we will see a new section:

There are plenty of changes in the script; first, the tag has been modified, having a new parameter:

<div id="tus-4261a310-6f0c-4cd9-b0f1-6128470b2aa3" class="thumbsupsurvey--app web" wait-for-method></div>

As you can see, there’s a new parameter called “wait-for-method”. These three words make all the difference; if you try to open the page, nothing will happen, and there will be no survey. You didn’t do something wrong, the survey is there and waiting for the moment the system will call the openSurvey() method for this survey. And specifically, it waits for the following call:

tusConfiguration['4261a310-6f0c-4cd9-b0f1-6128470b2aa3'].openSurvey();

Only when you will make this call, you will see the survey taking place.

Right after this line, there’s a survey, waiting for the method call.

Click here to see it in action.

Under the hood

What we did was, we grabbed the “click here” link as follows:

document.querySelector('[href="#click-to-method"]').addEventListener('click', function(event) {
  event.preventDefault();
  tusConfiguration['4261a310-6f0c-4cd9-b0f1-6128470b2aa3'].openSurvey();
})

The above script does all the necessary magic:

  1. Grabs the “click” event for the link
  2. Stops the standard action
  3. Starts the survey by calling the openSurvey() method

Conclusion

If you know some Javascript development, as you can see, you can do some nice magic and amaze your customers.

If you don’t know how to do it, there’s no problem; all you need to do is contact us and we’ll help you!

On our next article, we’ll show you how to open a survey via a click event and also how to open a survey with a delay. Stay in touch!

[1] The example used is for demo and training purposes only; the sample codes are used only for this demo. Each survey uses a different code.