I would like to limit the number of categories chosen (3 max) in the categories list of WordPress.
But Gutenberg interface use React and my jQuery code don't work.
Can I have some help please ?
jQuery(window).load(function() {
var limit = 3;
$('.edit-post-sidebar inputponents-checkbox-control__input').on('change', function(evt) {
if($(this).siblings(':checked').length >= limit) {
this.checked = false;
}
});
});
I found this part of code in components.js
file of WordPress :
function CheckboxControl(_ref) {
var label = _ref.label,
className = _ref.className,
heading = _ref.heading,
checked = _ref.checked,
help = _ref.help,
onChange = _ref.onChange,
props = Object(objectWithoutProperties["a" /* default */])(_ref, ["label", "className", "heading", "checked", "help", "onChange"]);
var instanceId = Object(external_this_wp_compose_["useInstanceId"])(CheckboxControl);
var id = "inspector-checkbox-control-".concat(instanceId);
var onChangeValue = function onChangeValue(event) {
return onChange(event.target.checked);
};
return Object(external_this_wp_element_["createElement"])(base_control, {
label: heading,
id: id,
help: help,
className: className
}, Object(external_this_wp_element_["createElement"])("span", {
className: "components-checkbox-control__input-container"
}, Object(external_this_wp_element_["createElement"])("input", Object(esm_extends["a" /* default */])({
id: id,
className: "components-checkbox-control__input",
type: "checkbox",
value: "1",
onChange: onChangeValue,
checked: checked,
"aria-describedby": !!help ? id + '__help' : undefined
}, props)), checked ? Object(external_this_wp_element_["createElement"])(build_module_icon["a" /* default */], {
icon: check["a" /* default */],
className: "components-checkbox-control__checked",
role: "presentation"
}) : null), Object(external_this_wp_element_["createElement"])("label", {
className: "components-checkbox-control__label",
htmlFor: id
}, label));
}