onChange Javascript directives for element no longer working

[SoilentRed]

I have a hunch this is related to an update attempt I made over the weekend. Long story short, I updated Joomla and JomSocial over the weekend. But the Jomsocial update ruined the site, so I had to reinstall the previous version and everything SEEMED to go back to normal. So I have the latest version of Joomla installed (Joomla! 3.9.21).

The current version I have of Fabrik is 3.9. I'm reluctant to update because there are so many moving parts on my site built on fabrik and I fear throwing something off-kilter. I also have an android and ios app working with the database of the site and I'm worried that the update might contain changes in the database structure that will affect the apps.

All that said, now when I go a form, the radiobuttons (depicted as stars) are not responding to my clicks like they used to. The onLoad directives work. You can see it work when the page loads and you briefly see the selected results, but now when I click the stars, nothing happens. Please help. Here's an active page you can use as an example: https://nia.bz/3ibALaS

Thanks!

 

[SoilentRed]

I restored a backup i took today to my computer and updated fabrik. Unfortunately, this didn't help to fix the problem.

So, I restored my previous backup from when the page was working and wheres what I found. Joomla updated the Beez3 Template.

I compared the template with the old working for and the new broken form using Diffmerge. Here's what I found. Most of the template was the same. There was one primary difference I thought was noteworthy and may be affecting this

The file I see that can be causing this is templates\beez3\javascript\template.js

Here is the code on the old WORKING template:

/**
 * @package     Joomla.Site
 * @subpackage  Templates.beez3
 * @copyright   Copyright (C) 2005 - 2019 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 * @since       3.2
 */

(function($)
{
    $(document).ready(function()
    {
        $('*[rel=tooltip]').tooltip();

        // Turn radios into btn-group
        $('.radio.btn-group label').addClass('btn');

        $(".btn-group label:not(.active)").click(function()
        {
            var label = $(this);
            var input = $('#' + label.attr('for'));

            if (!input.prop('checked')) {
                label.closest('.btn-group').find("label").removeClass('active btn-success btn-danger btn-primary');
                if (input.val() === '') {
                    label.addClass('active btn-primary');
                } else if (input.val() == 0) {
                    label.addClass('active btn-danger');
                } else {
                    label.addClass('active btn-success');
                }
                input.prop('checked', true);
                input.trigger('change');
            }
        });
        $(".btn-group input[checked=checked]").each(function()
        {
            if ($(this).val() == '') {
                $("label[for=" + $(this).attr('id') + "]").addClass('active btn-primary');
            } else if ($(this).val() == 0) {
                $("label[for=" + $(this).attr('id') + "]").addClass('active btn-danger');
            } else {
                $("label[for=" + $(this).attr('id') + "]").addClass('active btn-success');
            }
        });
    })
})(jQuery);

and here is the code on the new BROKEN template

/**
 * @package     Joomla.Site
 * @subpackage  Templates.beez3
 * @copyright   Copyright (C) 2005 - 2020 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 * @since       3.2
 */

jQuery(function($) {
    'use strict';

    $(document).on('click', ".btn-group label:not(.active)", function() {
            var $label = $(this);
            var $input = $(document.getElementById($label.attr('for')));

            if ($input.prop('checked'))
            {
                return;
            }

            $label.closest('.btn-group').find("label").removeClass('active btn-success btn-danger btn-primary');

            var btnClass = 'primary';

            if ($input.val() != '')
            {
                var reversed = $label.closest('.btn-group').hasClass('btn-group-reversed');
                btnClass = ($input.val() == 0 ? !reversed : reversed) ? 'danger' : 'success';
            }

            $label.addClass('active btn-' + btnClass);
            $input.prop('checked', true).trigger('change');
        })
        .on('subform-row-add', initButtonGroup)
        .on('subform-row-add', initTooltip);

    initButtonGroup();
    initTooltip();

    // Called once on domready, again when a subform row is added
    function initTooltip(event, container)
    {
        $(container || document).find('*[rel=tooltip]').tooltip();
    }

    // Called once on domready, again when a subform row is added
    function initButtonGroup(event, container)
    {
        var $container = $(container || document);

        // Turn radios into btn-group
        $container.find('.radio.btn-group label').addClass('btn');

        // Setup coloring for buttons
        $container.find('.btn-group input:checked').each(function() {
            var $input  = $(this);
            var $label = $(document.querySelector('label[for=' + $input.attr('id') + ']'));
            var btnClass = 'primary';

            if ($input.val() != '')
            {
                var reversed = $input.parent().hasClass('btn-group-reversed');
                btnClass = ($input.val() == 0 ? !reversed : reversed) ? 'danger' : 'success';
            }

            $label.addClass('active btn-' + btnClass);
        });
    }
});

Of course, there were other files that also had changes, but I think that this might be the offender. I'm going to try copying the original templates\beez3\javascript\template.js to the new site and let you know how it turns out.

 

[SoilentRed]

Okay, that seems to have worked. Form is working as it should. Hopefully this was good info for you all to use.

Hope yall are well!

Cheers!