• I’m working on a widget plugin that uses HTML5 sessionStorage and I want to be able to clear sessionStorage from the widget administration page. I added an <a> element to my widget, with an ID of “clear-storage” & I’m trying to get a jQuery “click” event to work for the element. It seems like it should be straight forward, but I cannot get the link to trigger the “click” event when I click the associated element.

    Here’s the relevant HTML from my widget’s form:
    (only the <a> tag is actually relevant)

    <p>
    	<input 	id="<?php echo $this->get_field_id('keep_open'); ?>"
    		name="<?php echo $this->get_field_name('keep_open'); ?>"
    		helpjquery="keep_open"
    		type="checkbox"
    		value="1"
    		<?php checked( '1', $keep_open ); ?> />
    	<label for="<?php echo $this->get_field_id('keep_open'); ?>"><?php _e('Keep the <b>same</b> menus expanded/collapsed after clicking a link'); ?></label>
    	<br />
    	<small><?php _e( 'If checked, any menus openned or closed on the last page you visited will remain open or closed.' ); ?></small>
    	<a id="clear-storage" href="">Clear Storage</a>
    </p>

    At the top of that file, I enqueue my scripts with this code:

    function enable_menu_state_cleanup () {
    	wp_enqueue_script('menu_state', plugin_dir_url(__FILE__) . 'js/menu_state.js', array('jquery'));
    	wp_enqueue_script('widget_handler', plugin_dir_url(__FILE__) . 'js/widget_handler.js', array('jquery'));
    }
    add_action ('admin_head-widgets.php', 'enable_menu_state_cleanup');

    Here’s the JavaScript code that I am trying to trigger:

    jQuery(document).ready(function(){
    
    	// Button to clear storage.
    	var clear_button  = jQuery("#clear-storage");
    	console.debug("clear button: " + clear_button.attr("id"));
    	clear_button.click(function(event) {
    		console.debug("clear storage");
    		event.preventDefault();
    	});

    Currently all that the “ready” & “click” functions are supposed to do is print to the console. The console.debug call outside of the “click” function gets called, but when I click on the “clear-storage” link, console.debug(“clear storage”) does not get called. (Neither does the preventDefault method).

    Can anyone see something wrong with what I’m doing?
    Am I enqueueing the scripts at the wrong time for a “click” event to work?
    Do you need me to include more code?

    Thanks in advance,
    Dan

  • The topic ‘jQuery click event problem on widget admin page’ is closed to new replies.