title: Ajax response returned stating its property values are undefined
body: <p>I have 2 JS files, one containing a list of generic functions to be shared between multiple files called "form.js", and another specific to a certain page on my CMS called "blog.form.js".</p>
  
  <p>Inside "form.js", I have a generic JS function that makes a jQuery.ajax() request whenever I've requested to load a record from the database:</p>
  
  <pre><code>function load_record( field_id, class_name, entity_type ) {
  
  // Send ajax request to load the record, and enable the form's state once the record's content has been received.
  var response = $.ajax({
      async: false,
      dataType: "json",
      data: {
          action: "load_"+entity_type,
          id: $("#"+field_id+"_list").val()
      },
      success: function(response) {
          // Make visible the buttons to allow actions on record, such as deleting or renaming.
          $("#"+field_id+"_actions").show();
  
          // Make visible the container of all form elements related to the record.
          $("#"+field_id+"_form_inputs").show();
  
          // Must return response so the calling JS file can use the values returned to
          // populate the form inputs associated with the record that's just been loaded
          // with the correct values.
          return response;
      },
      type: "post",
      url: "/ajax/record/"+class_name
  });
  alert( response.link + " " + response + " " + response.responseText);
  return response;
  </code></pre>
  
  <p>}</p>
  
  <p>Inside "blog.form.js", I have function called when I select a database record to load from a menu containing a list of them:</p>
  
  <pre><code>// Select a link for editing.
  $("#links_list").live( "change", function(){ 
      // Insert response returned from function call to load the db record into a variable.
      // This is so the form inputs associated with the record loaded can be populated with the correct values. 
      var response = load_record('links_edit', 'blog', 'link'); 
      alert( response.link );
      $("#links_edit_url").val( response.link );        
  });
  </code></pre>
  
  <p>The ajax request returns the desired response. Unfortunately, the debug alert statement "alert( response.link + " " + response + " " + response.responseText)" inside load_record() returns the following: undefined [Object XMLHTTPRequest] {"link": "http://www.url.com"}.</p>
  
  <p>Thus, the debug alert statement "alert( response.link )" in the other function returns undefined as well.</p>
  
  <p>An XMLHTTPRequest object is returned successfully. So, why is response.link stating its value is undefined?</p>
  
  <p>Any help is much appreciated.</p>