I’m not a jQuery expert, but from what I know jQuery should’t really be implemented within onClick.
Try moving your code outside of onClick into a <script type="text/javascript"></script> block. For example:
<script type="text/javascript">
jQuery(document).ready(function($){
$('#localauthorityradiobuttonid').click(function(){
$('#authoritypanel').show();
},function(){
$('#authoritypanel').hide();
});
});
</script>
Be sure to define an ID or class for your radio buttons in order to easily access them with jQuery.
Yeah, admittedly I was being a bit lazy there doing an onclick! Just wanted to get it working first, and then tidy up later.
Doing it properly still doesn’t seem to work, even if I just try an alert and again, I don’t see any errors in Firebug??!
On reflection, my problem looks very much related to this:
http://wordpress.org/support/topic/289414?replies=1
Although there are no replies – seems like it’s been an issue since 2.8. Anyone know whey the WP team would put this ‘feature’ in?
I just threw this code up into my development blog (granted, it’s WP 3.0) without issue — I used this js code:
<script type="text/javascript">
jQuery(document).ready(function($){
$('#postcodebutton').click(function(){
$('#postcodepanel').toggle();
});
$('#authoritycodebutton').click(function(){
$('#postcodepanel').toggle();
});
});
</script>
- Be sure jQuery is being loaded. You should be using
wp_enqueue_script('jquery'); and calling it before wp_head();. Check to make sure it’s loaded and not giving a 404 error using Firebug or similar tool.`
- Be sure your code is wrapped in
jQuery(document).ready(function($){ to avoid conflicts and allow you to use the $
Thanks, but that’s still not working for me. I probably didn’t make it clear that this is in widget options in the backend, rather than on the main frontend of the site, so using wp_enqueue_script('jquery') before wp_head isn’t an option unfortunately. I’ve also set up an alert that runs onload, which actually runs twice, could that have something to do with it?
I’ve put my code in a Gist here to give you more of an idea of what I want to achieve:
https://gist.github.com/896f11d7ca928681a253
Thanks a lot for your help so far 🙂
Phew. Not sure why the jquery selectors we were using before didn’t work within the context of a widget, but here’s how I ended up getting it to work:
<script type="text/javascript">
jQuery(document).ready(function($) {
$('input[id=postcodebutton]').click(function(){
alert('postcodebutton');
});
$('input[id=authoritybutton]').click(function(){
alert('authoritybutton');
});
});
</script>
Note that I also ran this code within the <head> tags by echoing it within a function and hooking the function to admin_head.
add_action("admin_head", "pa_script");
Ah, seems like I’ve nailed it. I changed the IDs to classes and, presto changeo, it worked! Thanks for the pointers!
No problem, glad it was able to get figured out.
