insert autofocus in a custom taxonomy form

Question

I've created a custom taxonomy and added it to the admin menu. It works fine but I'd like to tweak it a little so that the input autofocus goes to the "name" field as soon as I select to add a new term. I've looked at edit-tags.php and can't find where I can insert this.

Thanks in advance!

EDIT:

Howdy_Mcgee's code worked perfectly. Now I need to add it a second time for a different taxonomy and this time it won't work. I changed the "tag_focus" function name in the function declaration line and in the add_action line. To me, it doesn't seem I should change anything else, should I? Or can I modify the first function to work on both pages? All the code for both taxonomies is in the child theme's function file.

Thanks again!

Answer 1

You can use wp_register_script() then wp_enqueue_script() to inject javascript into wp admin.

functions.php or plugin (my personal recc would be a simple plugin):

wp_register_script( 'focus-tag-name-script', 'path/to/script.js' , 10 );
wp_enqueue_script( 'focus-tag-name-script' );

script:

jQuery( window ).on( 'load', function() {
    jQuery( 'input[name="tag-name"]' )
        .focus() // place cursor in field
        .select(); // select field contents
} );

As requested in the comments, here it is as a plugin: (I just wrote this out here without testing, but at the very least should put you in the right direction if there are any errors)

// define the plugin
jQuery( function( $ ) {
  $.fn.fieldFocus = function( options ) {

    var settings = $.extend({
        select: false
    }, options );

    this.focus() // place cursor in field
    if ( settings.selectContents ) this.select(); // select field contents
  } );
} );

// calling the plugin
jQuery( window ).on( 'load', function() {
  // places cursor in the field
  jQuery( 'input[name="tag-name"]' ).fieldFocus();

  // places cursor in the field and selects contents
  jQuery( 'input[name="tag-name"]' ).fieldFocus( {
    selectContents: true
  } );
}

Answer 2

Maybe this will work for you:

function tag_focus() {
    if( isset( $_GET['taxonomy'] ) && 'YOUR_TAXONOMY_HERE' == $_GET['taxonomy'] ) :
  ?>

    <script type="text/javascript">
        jQuery( document ).ready( function() {
            jQuery( '#submit' ).click( function() {
                jQuery( '#tag-name' ).focus();
            } );
        } );
    </script>

  <?php endif;
}
add_action( 'admin_head-edit-tags.php', 'tag_focus' );

This is a little bit of JS to get what you want done. If you want to use this on all taxonomies ( built-in and custom ) then you could remove the conditional entirely. The JS will only run on the edit-tags.php page as specified by our action.