AnswerHub 2.6 Release Notes Addendum

Introduction

This release includes changes that may conflict with custom themes that inherit from the Teamhub base theme. If your site is using compatibility themes (Teamhub 1.6.6), it is not likely to be adversely impacted by the most recent set of changes, however as with any release, we encourage you to evaluate any code within custom themes or within the Custom configurations > Custom Header/Footer section of the admin panel.

To view the 2.6 Release Notes click here.

Select Input Changes

Change Summary

To improve overall accessibility and consistency within the AnswerHub UI, we have migrated to version 4.0 of Select2 and removed Awesomeplete from the platform. To make inputs compatible with the latest version, we updated templates to use ‘’ elements instead of ‘’ elements. We also update the related JavaScript to accommodate changes in how the latest version handles ajax calls and input events.

A full list of potentially impacted pages and templates is available here.

NOTE: Please reach out to Customer Success if you experience issues with the select boxes on impacted pages.

Potential Impact on Custom Themes

Custom theme files that overwrite any of the impacted template or that use Select2 may not have the markup and script changes necessary for compatibility with Select2 4.0. We encourage you to test your site thoroughly to ensure that this update will not cause issues with the code in your custom header/footer or within your custom theme files.

Important Changes to Select2 Inputs

Style Changes

We updated the classes applied to elements comprising the Select2 multi and single select boxes in this release. You may need to update any related custom styles included in the Custom configurations > Custom Header/Footer section of the admin panel or custom theme files to accommodate this change.

Markup Changes

One of the major changes is that Select2 does not allow the use of input elements for single or multi-select boxes.

If your input looks like this:

<input id="select2-test" />

<script>
 (function($) {
          var select2Options = {
                 tags: ["Option 1", "Option 2", "Option 3"]
          }
         $('#select2-test').select2(select2Options);
})(jQuery);
</script>

You may need to update your template to:

<select multiple="multiple" id="select2-test">
         <option value="1">Option 1</option>
         <option value="2">Option 2</option>
         <option value="3">Option 3</option>
<select>

<script>
(function($) {
        var select2Options = {
                  tags: true
        }
       $('#select2-test').select2(select2Options);
})(jQuery);
<script>

Adding Prepopulated Options

The system will include any options within your select input in the list of possible results when the user searches.

Allowing Custom Options

If you need users to use custom tags, you can add the “tags” property with a value of true to the Select2 options object to add allowed custom options.

Multi vs. Single Select

There are two ways to make a select into a multi-select box:

1. Add a “multiple” attribute to the HTML5 select element.
2. Add a “multiple” property to the options object for your input.

NOTE: If the “multiple” attribute is omitted from the select HTML element, the select box will be rendered as a single select by default.

Select2 Options: Property Name Changes

Property names on the Select2 options object have been updated. Here are some of the most common options:

Custom Text Properties for Input Popups

Change Summary

This release includes improvements to popovers on form elements (such as the titles and topics fields on the “Ask a Question” form). For a more comprehensive list of impacted pages, see the full list here.

Potential Impact on Custom Themes

Due to this change, you may need to review any properties overwritten for input popups to ensure that escaped single and double quotes get exchanged for HTML entities, and line-breaks get exchanged for “
”. If you use /n, /’, or /” in popover properties, you may encounter JavaScript errors.

📘

NOTE:

Please reach out to Customer Success if you experience any issues with text properties or translation files.

Style Changes

We have updated the classes applied to elements comprising the input popups in this release. You may need to update any related custom styles included in the Custom configurations > Custom Header/Footer section of the admin panel or custom theme files to accommodate this change.