title: How to return a Json label/value pair from C# Controller Action for jQuery AutoComplete
body: <p>I need to create a jQuery Autocomplete textbox that gets a list of names from the DB, and when selected, sends the user to the appropriate page link. </p>
  
  <p>I'm trying to do something just like this post: <a href="https://stackoverflow.com/questions/5655995/fire-a-controller-action-from-a-jquery-autocomplete-selection">Fire a controller action from a jQuery Autocomplete selection</a></p>
  
  <p>The solution makes sense, and the click and redirect works, but I don't know how to return more than just a string list of names. </p>
  
  <p>Current controller code (snippet):</p>
  
  <pre><code>        List&lt;string&gt; Names = new List&lt;string&gt;();
          foreach (Child c in listfromDB)
          {
              Names.Add(c.Name);
              //childNames.Add(new KeyValuePair&lt;string, int&gt;(c.Name, c.ID));
          }
          return Json(Names);
  </code></pre>
  
  <p>The <code>KeyValuePair</code> didn't seem to work. How do I create an object array instead? </p>
  
  <p>My jQuery code:</p>
  
  <pre><code>$(document).ready(function () {
  $("#find-child-box").autocomplete({
  source: function (request, response) {
      // define a function to call your Action (assuming UserController)
      $.ajax({
          url: '/Admin/AutoCompleteMyChildren', type: "POST", dataType: "json",
  
          // query will be the param used by your action method
          data: { query: request.term },
          success: function (data) {
              response($.map(data, function (item) {
                  return { label: item, value: item };
              }))
          }
      })
  },
  minLength: 1, // require at least one character from the user
  select: function(event, ui) {
  alert('mom');
      window.location.href = ui.item.value;
  }
  }); 
  });
  </code></pre>