Why isn't my autocomplete.js textfield responding to input (Drupal 7)?

Question

I am trying to get auto complete to work for a text field in my Drupal installation. This is a large project, and I'm not yet familiar with Drupal and this large codebase. Please assume that I can make the simplest of mistakes.

Okay, so I've been following the simple tutorials on how to get my textfield to autocomplete.

I have a hook_menu():

/**
 * Implements hook_menu().
 */
function mod_name_menu() {
  $items = array();

  // Not important for this question. This is the submit URL.
  $items['apps/name/result'] = array(
    'title' => t('Result page'),
    'file' => 'mod_name.pages.inc',
    'file path' => drupal_get_path('module', 'mod_name'),
    'page callback' => 'drupal_get_form',
    'page arguments' => array('mod_name_course_display_form'),
    'access callback' => TRUE,
    'type' => MENU_CALLBACK,
  );

  // This is the relevant one!
  $items['apps/name/course-codes'] = array(
    'file' => 'mod_name.pages.inc',
    'file path' => drupal_get_path('module', 'mod_name'),
    'page callback' => 'mod_name_course_code_list',
    'page arguments' => array('access content'),
    'access callback' => TRUE,
    'type' => MENU_CALLBACK,
  );

  return $items;
}

I have a rather large form to work with, but the relevant piece for the textfield is as follows:

(mod_name.pages.inc)

function mod_name_basic_block_form($form, &$form_state) {

  [...]

  $form['search']['course_code'] = array(
    '#id' => 'course-code-textbox',
    '#type' => 'textfield',
    '#title' => t('Course code'),
    '#default_value' => (isset($_POST['course_code']) ?
      strtoupper($_POST['course_code']) :
      (isset($_GET['course_code']) ?
        $_GET['course_code'] :
        '')),
    '#required' => FALSE,
    '#size' => '20',
    '#autocomplete_path' => 'apps/name/course-codes',
  );

  [...]

  return $form;
}

[...]

/**
 * Autocomplete for the course-code form.
 */
function mod_name_course_code_list($text) {
  $results = array('1' => 'Thing 1', '2' => 'Thing 2');
  drupal_json_output($results);
}

[...]

I have just kept the callback function a static array for now to see how the autocomplete behaves. I expect that when I type in the textfield, the throbber should throb and then I would see as autocompletes "Thing 1", "Thing 2" or similar. However, when I type in the textfield, nothing occurs. I do see a gray throbber on page load, but it does not animate while typing, blurring, or clicking.

When inspecting the page, I see that autocomplete.js is loaded in the Network tab. I also see that the input field has autocomplete attributes. I have tried both in Firefox and Chrome and neither produce any action whatsoever.

I am using Drupal 7.32

Any help or clues where to look next would be greatly appreciated.

EDIT: I should mention that when I visit apps/name/course-codes, I do get a JSON response as expected of {"1":"Thing 1","2":"Thing 2"}

Answer 1

I ran your code in a test environment, and I got autocomplete to work by adjusting your test JSON to simply $results = array('Thing 1', 'Thing 2')