Partial view not showing MVC razor

This is my first time using partial views and I cannot get the actual partial view. The ajax function is called, the controller gets hit, and the warning in the ajax call shows me that there is a partial view. But, with errors logged to the console (or warning), my div stays the same empty. My app is an MVC4 app, but I'm sure I just made a stupid mistake somewhere, not an MVC error :)

Take a few hours of surfing the web, I would be really happy if someone can help me get this working and all the code / ajax tips / comments I loved!

public PartialViewResult Groups()
{
        var person = _userRepository.GetCurrentUser();
        var connections = (from c in person.Person1 select c).ToList();
        var groups = _context.Groups.Where(g => g.GroupId == 1);

        var all = new GroupViewModel()
                      {
                          Connections = connections,
                          GroupDetailses = (from g in groups
                                            select
                                                new GroupDetails
                                                    {
                                                        Name = g.Name,
                                                        StartDate = g.StartDate,
                                                        StartedById = g.StartedById,
                                                    })

                      };
        return PartialView("Groups",all);
}

      

        
        
        
      

    

My PartialView

@model Mvc4m.Models.GroupViewModel

<h2>Groups</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<h3>Create new Group</h3>
<div class="ui-widget">
    <label for="group">Groupname: </label>
    <input id="group" />
    <button onclick="addGroup()">Add</button>
</div>

@foreach (var item in Model.GroupDetailses)
{
    @Html.LabelFor(model => item.Name)<text> : </text>
    @Html.DisplayFor(model => item.Name)
}
<script>
    function addGroup() {
        $.get(
                "/Profile/AddGroup",
                {
                    Name: $("#group").val()
                });
        location.reload();
    };
</script>

      

        
        
        
      

    

My Ajax call to profile / index

@model Mvc4m.Models.ProfileView

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<div id="test" style="background-color:Aqua; width:200px; height:100px"></div>

<button onclick="load()"></button>

<script type="text/javascript">
function load() {
    $.ajax({
        type: "GET",
        url: '/Profile/Groups',
        dataType: 'html',
        success: function (response) {
            $('#test').html(response);
            alert(response);
        },
        error: function (xhr, status, error) {
            alert(status + " : " + error);
        }

    });
}

</script>