JSFiddle - React, Tailwind, and code Playground
HTML
The js file below is located in
typo3conf/ext/powermail/templates/tmpl_frontend.js
Have a look at the commands in lines
<ul>
<li>39-41</li>
<li>35-36</li>
<li>26</li>
<li>6-8</li>
</ul>
Useful documentation: Look into lines 20 and 21
JavaScript
(function($) {
// ... some code
$('.tx_powermail_pi1_form input:radio').click(function() {
// after form has validated, we use the validation for
// all radio buttons in our radio button group
// we use here blur as the inputEvent is "blur" in line 23
$(this).parent().parent().find('input:radio').blur();
});
// ... some code
if (!###VALIDATOR_DISABLE###) {
powermail_validator = $('.tx_powermail_pi1_form').validator({
// config variables:
// see http://jquerytools.org/documentation/validator/index.html#api
position: 'top right',
offset: [-5, -20],
message: '<div><em/></div>',
inputEvent: 'blur',
grouped: true,
singleError: false,
// We check the validity of the fields if the form is submitted
formEvent : 'submit',
onBeforeValidate: function(e, els) {
clearPlaceholderValue(e, els);
},
onBeforeFail: function(e, els, matcher) {
setPlaceholderValue(e, els, matcher);
},
onFail: function(e, els) {
// We do not want scrolling to the field where validation failed
//$('html,body').animate({ "scrollTop": $(els[0].input).offset().top - 50}, 1000);
}
});
// We do not want the built-in check (supposed to be built by powermail extension authors) for //radio buttons
$('.tx_powermail_pi1_form input[type=radio]').unbind("change");
}
// some code ...
});
})(jQuery);