Edit a module or article in frontend
Have radio buttons aligned with grey background and green/red for yes/no (from default bootstrap styles)
Radio buttons not styled at all, quite unusable
Joomla! 3.7.5, template protostar, bootstrap loaded, standard config
I have seen that the "btn" and "btn-active" css classes are missing in the html code of the radio buttons. This occurs only in frontend
For info, using Protostar it works because of the Javascript added in the file template.js which adds manually the css classes.
I don't think that it is a good solution to use some javascript here as the radio buttons shall have the needed css classes in the html code, not using JS
I have seen that the "btn" and "btn-active" css classes are missing in the html code of the radio buttons. This occurs only in frontend
For info, using Protostar it works because of the Javascript added in the file template.js which adds manually the css classes.
I think there is a reasoning behind this
The idea is that only the outer container will be added some bootstrap classes classes to indicate if the radio-set will be shown using bootstrap, these outer container classes as you know already are
-- either specificied in the XML file
-- or when you add them to the class attributes when you call the radio form element in custom code
This allows you to create a radio-input-sets that are styled without bootstap,
plus the code of the form element itself knows nothing / little about bootstrap
and e.g. we can go to next bootstrap version with no changes into the code of the radio form element ?
the downside is adding the JS code you describe in the template.js
maybe someone else can provide a better explaination here ?
FWIW in Joomla 4 this won't be an issue anymore as all UI components will encapsulate all the required styling and js.
e.g. https://joomla-projects.github.io/custom-elements/#/group-buttons
and https://joomla-projects.github.io/custom-elements/#/switcher
Now for Joomla 3 might worth it to try to move the js in the respected radio/checkboxes layout somehow, might not be possible from a B/C point of view tho...
Status | New | ⇒ | Discussion |
sorry for the late reply. Here are the screenshot of a module edition, using Protostar.
with template.js
without template.js
the radio buttons are only rendered correctly if there is some JS to add the CSS classes
Status | Discussion | ⇒ | Information Required |
@ced1870 Is this still an issue in the latest J3?
@jwaisner of course tested with Joomla 3.9.16. Why ? is there any reason why this issue would have magically disappeared ? :)
I need to add the JS in all templates to render the radio buttons correctly
make a simple test : rename the "template.js" file from Protostar, edit a module in front
Status | Information Required | ⇒ | Confirmed |
@ced1870 It is possible that since you opened this a PR has changed or corrected the reported bug, hence my ask. I have set this to confirmed.
ok then I confirm that this is still the same. Works in Protostar because of the template.js file only
Labels |
Added:
No Code Attached Yet
Information Required
Removed: ? |
Thank you for raising this issue.
Joomla 3 is now in security only mode with no further bug fixes or new features.
As this issue doesn't relate to Joomla 4 it will now been closed.
If we are mistaken and this does apply to Joomla 4 please open a new issue (and reference this one if you wish) with updated details for testing in Joomla 4.
cc @zero-24
Status | Confirmed | ⇒ | Closed |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2022-08-23 19:45:13 |
Closed_By | ⇒ | zero-24 |
Can you post some screenshots please