I’ve discovered in the documentation the action for applying javascript code to ACF fields (if I’m interpreting this correctly). The documentation can be found HERE
My problem is that I’m having trouble getting the javascript to work. My code is targeting an ACF checkbox which when checked, is supposed to unhide a div that’s already on the page and hidden.
My code is:
function my_acf_admin_head()
{
?>
<style type="text/css">
#CompletedDonorApplication {display:none;background:#eef;padding:10px;text-align:center;}
</style>
<script type="text/javascript">
(function($){
var elem = document.getElementById('CompletedDonorApplication'),
checkBox = document.getElementById('acf-field-donor_completed_consent');
checkBox.checked = false;
checkBox.onchange = function() {
elem.style.display = this.checked ? 'block' : 'none';
};
checkBox.onchange();
})(jQuery);
</script>
<?php
}
add_action('acf/input/admin_head', 'my_acf_admin_head');
I created my own separate plugin that I use to house scripts that I use to affect core files rather than editing the core files themselves. So in the code example above it would start and end with opening and closing php tags.
The problem is that this isn’t working. Clicking on the ACF checkbox does not unhide the div like I had hoped. Is there a specific place I should put the above code? Please help.
try this way
<script type="text/javascript">
jQuery(function($){
/** your code **/
});
</script>
