Skip to main content

​
Method Signature

constructorio.tracker.trackQuizResultsLoaded(parameters, networkParameters?)
Tracks when product results from a quiz are displayed to the user. This helps Constructor.io measure quiz performance and optimize product recommendations.

​
Parameters

​
parameters
object
required
The tracking parameters.
​
networkParameters
object
Network-specific parameters.

​
Returns

Returns true on success or an Error object on failure.

​
Examples

​
Basic Usage

const quizResults = await constructorio.quizzes.getQuizResults('style-quiz', {
  quizSessionId: sessionId,
  answers: userAnswers
});

constructorio.tracker.trackQuizResultsLoaded({
  quizId: 'style-quiz',
  quizVersionId: quizResults.quiz_version_id,
  quizSessionId: quizResults.quiz_session_id,
  url: window.location.href,
  items: quizResults.response.results.map(result => ({
    itemId: result.data.id,
    itemName: result.value
  })),
  resultCount: quizResults.response.total_num_results,
  resultId: quizResults.result_id
});

​
With Pagination

constructorio.tracker.trackQuizResultsLoaded({
  quizId: 'product-finder',
  quizVersionId: quizResults.quiz_version_id,
  quizSessionId: quizResults.quiz_session_id,
  url: window.location.href,
  items: quizResults.response.results.map(result => ({
    itemId: result.data.id,
    itemName: result.value,
    variationId: result.data.variation_id
  })),
  resultCount: quizResults.response.total_num_results,
  resultPage: 2,
  resultId: quizResults.result_id
});

​
Complete Quiz Flow with Tracking

class QuizManager {
  constructor(quizId) {
    this.quizId = quizId;
    this.sessionId = null;
    this.versionId = null;
    this.answers = [];
  }
  
  async startQuiz() {
    const question = await constructorio.quizzes.getQuizNextQuestion(this.quizId);
    this.sessionId = question.quiz_session_id;
    this.versionId = question.quiz_version_id;
    return question;
  }
  
  async submitAnswer(answer) {
    this.answers.push(answer);
    return constructorio.quizzes.getQuizNextQuestion(this.quizId, {
      quizSessionId: this.sessionId,
      answers: this.answers
    });
  }
  
  async getResults() {
    const results = await constructorio.quizzes.getQuizResults(this.quizId, {
      quizSessionId: this.sessionId,
      answers: this.answers
    });
    
    // Track that results were loaded
    constructorio.tracker.trackQuizResultsLoaded({
      quizId: this.quizId,
      quizVersionId: results.quiz_version_id,
      quizSessionId: results.quiz_session_id,
      url: window.location.href,
      items: results.response.results.map(result => ({
        itemId: result.data.id,
        itemName: result.value
      })),
      resultCount: results.response.total_num_results,
      resultId: results.result_id
    });
    
    return results;
  }
}

​
In a React Component

import { useEffect } from 'react';

function QuizResultsPage({ quizId, sessionId, results }) {
  useEffect(() => {
    if (results) {
      constructorio.tracker.trackQuizResultsLoaded({
        quizId,
        quizVersionId: results.quiz_version_id,
        quizSessionId: results.quiz_session_id,
        url: window.location.href,
        items: results.response.results.map(r => ({
          itemId: r.data.id,
          itemName: r.value
        })),
        resultCount: results.response.total_num_results,
        resultId: results.result_id
      });
    }
  }, [quizId, sessionId, results]);
  
  return (
    <div>
      <h2>Your Recommendations</h2>
      {/* Display results */}
    </div>
  );
}

​
When to Use

Track quiz results loaded:
  • Immediately after quiz results are rendered on the page
  • When a user navigates to a new page of quiz results
  • After filtering or sorting quiz results
This event helps Constructor.io:
  • Measure quiz completion rates
  • Analyze which products are recommended for different quiz answers
  • Optimize quiz result quality

​
Best Practices

  1. Track Once Per Page Load: Only call this when results are first displayed, not on every re-render.
  2. Include All Visible Items: The items array should contain all products currently visible to the user.
  3. Use Correct IDs: Ensure quizId, quizVersionId, and quizSessionId match those from the quiz results response.
  4. Track Pagination: When users navigate to a new page of results, track a new results loaded event with the updated resultPage.

​
Error Handling

try {
  const result = constructorio.tracker.trackQuizResultsLoaded({
    quizId: 'style-quiz',
    quizVersionId: versionId,
    quizSessionId: sessionId,
    url: window.location.href,
    items: displayedItems
  });
  
  if (result instanceof Error) {
    console.error('Tracking failed:', result);
  }
} catch (error) {
  console.error('Error tracking quiz results loaded:', error);
}

Build docs developers (and LLMs) love

Get started for freeTalk to us