Useful AMD modules for custom question types

cbj

This is simply jQuery, which CB loads AMD style without global namespace (to avoid version issues with 3rd party vendors).

Example:

cbrequire(['cbj'], function($) { $('.something'); }); // or in your custom js module define(['cbj', 'otherModule'], function($, otherModule) { });

 

configbox/configurator.sendSelectionToServer()

With this method you send the user’s selection to the backend for processing. You react to responses from the server with the methods of your JS Question Type Object.

cbrequire(['configbox/configurator'], function(configurator) { configurator.sendSelectionToServer(questionId, selection); });

Parameters

questionId (Number)

The ID of the question. Within JS you get the ID from data-attribute ‘question-id’ in the wrapper div of your question template.

selection (Number, String, null)

The selection that the user has made. The CB backend will store any value. It will be sanitized as string (HTML tags stripped). If your question type uses predefined answers, then they need to be the ID of the answer).

The value will be available to you in your view template as $this->selection.

Example during question type init:

define(['cbj', 'configbox/configurator'], function($, configurator) { var customType = { .. initEach: function() { $('.question.type-customtype').on('click', '.some-button', function() { let questionId = $(this).parent('.question').data('questionId'); let selection = $(this).data('some-data-attribute'); configurator.sendSelectionToServer(questionId, selection); }); } .. } ... configurator.registerQuestionType('customtype', customType); });

 

configbox/server.makeRequest()

Use this method to retrieve JSON data from any CB controller task (built-in or custom).

Parameters

controller (String)

Name of the controller to use. See KenedoController on how to add a custom controller to act as backend.

task (String)

Task name, essentially the name of a public method in your controller class.

data (Plain object or Array)

Any data you need to send to the controller task. You have key/value pairs of strings or JS File/Filelist.

Return value

Return value is jQuery’s jqXHR, so you chain done(), error(), always() providing callback functions.

 

configbox/server.injectHtml()

Use this method to fetch HTML from a KenedoController (typically it fetches a view) and it to the target HTML element.

The framework will inject the HTML and in case the HTML contains a KenedoView, it’s JS initEach and initOnce methods will be called.

Parameters

target (String or jQuery Collection)

Provide either a CSS selector to your target element or a jQuery collection. The fetches HTML will be injected there.

controller (String)

Name of the controller to use. See KenedoController on how to add a custom controller to act as backend.

task (String)

Task name, essentially the public method’s name to call within your controller

data (Plain object or Array) - optional

Any data you need to send to the controller task. You have key/value pairs of strings.

callback (Function) - optional

A callback function that will get called once the HTML is injected.