jquery.autocomplete within asp.net mvc ajax form

Question

Hi,

I am trying to use the jquery.autocomplete plugin within a ajax form. The form is also within a modal dialog using thickbox.

The problem is that it seems to correctly call the controller method and return the results, but it does not actually display anything on the screen. I copied the markup code into a regular view and it worked, also within the ajax form.

Any help appreciated, code below:

<script src="../../jquery.plugins/autocomplete/jquery.autocomplete.min.js" type="text/javascript"></script>
<link href="../../jquery.plugins/autocomplete/jquery.autocomplete.css" rel="stylesheet" type="text/css" />

 <script type="text/javascript">  
        $(document).ready(function() {
            $("input#Category").autocomplete('<%= Url.Action("Category", "Search") %>');
        }); 
</script>

<% using (Ajax.BeginForm("Upload", "Profile", null, new AjaxOptions { UpdateTargetId = "uploadArea", InsertionMode = InsertionMode.Replace, OnBegin="" }, new { id="upload", name="upload", enctype = "multipart/form-data"}))
  {  %>
    <div id="uploadArea">
        <%= Html.TextBox("Category") %><br /><br />
    </div>
<% } %>

and the controller

 public ActionResult Category(string q)
    {
        var result = entities.FishCategory.Where(f => f.Category.StartsWith(q)).Select(f => f.Category).ToArray();
        return Content(string.Join("\n", result));
    }