title: ASP MVC AJAX return object and access in JavaScript as an Associative Array
body: <p>I am trying to get my head around ASP MVC with using AJAX requests to the C# controller, as it stands; I am able to call my controller from my AJAX request. However I'm struggling to return the results I'm looking for.</p>
  
  <p>Overall I'm attempting to get some data from the database and return it as an array to JavaScript. What would be fantastic is if in JavaScript I could access the data in a format such as <code>array["key"]</code> using an associative array.</p>
  
  <p>However, this is what I am encountering with my AJAX request, Initially I call the controller from my AJAX.</p>
  
  <pre><code>$.ajax({
          type: "POST",
          url: "/booking/getParks",
          dataType: "JSON",
          async: false,
          success: function (data) {
              alert(data.data);
          }
      });
  </code></pre>
  
  <p>This calls my very simple function in my booking controller as you can see below.</p>
  
  <pre><code>[AcceptVerbs(HttpVerbs.Post)]
          public ActionResult getParks(string stylesheet)
          {
              var parks = Database.Open("SQLServerConnectionString").Query("SELECT * FROM Park");
              return Json(new { data = parks });
          }
  </code></pre>
  
  <p>Now when I alert in the JavaScript AJAX success function you can see I call the <code>data.data</code>, this outputs the following:</p>
  
  <p><img src="https://i.stack.imgur.com/trvv6.jpg" alt="enter image description here"></p>
  
  <p>Now, if I was to reference <code>data.data[0]</code>, this would output <code>[object Object]</code> and if I was to further reference <code>data.data[0]["id"]</code> which in my case I would expect an output of 1. Instead I receive <code>undefined</code>.</p>
  
  <p>Now, I'm guessing that this has something to do with the way that I am returning a C# dynamic.</p>
  
  <p>However, I am presuming that I am returning the Object to AJAX incorrectly.</p>
  
  <p>How can I return the values so that they are an associative array in JavaScript? Or even a method in which I can receive the data and convert it JavaScript side maybe...</p>
  
  <p>Thank you.</p>
  
  <p><strong>EDIT:</strong></p>
  
  <pre><code>alert(JSON.stringify(data));
  </code></pre>
  
  <p>Returns:</p>
  
  <p><img src="https://i.stack.imgur.com/14F2y.jpg" alt="enter image description here"></p>