MVC ajax странное поведение

---

Я новичок в веб-программировании и пробую Ajax с примером MVC в качестве примера проекта.
Фильтрация записи при выборе значения из combobox, но получение дубликата списка вместо фильтрации в той же html-таблице.

Это контроллер

public class TestController : Controller
    {
        private readonly User[] userData =
        {
            new User {FirstName = "Edy", LastName = "Clooney", Role = Role.Admin},
            new User {FirstName = "David", LastName = "Sanderson", Role = Role.Admin},
            new User {FirstName = "Pandy", LastName = "Griffyth", Role = Role.Normal},
            new User {FirstName = "Joe", LastName = "Gubbins", Role = Role.Normal},
            new User {FirstName = "Mike", LastName = "Smith", Role = Role.Guest}
        };

        public PartialViewResult GetUserData(string selectedRole = "All")
        {
            IEnumerable data = userData;
            if (selectedRole != "All")
            {
                var selected = (Role)Enum.Parse(typeof(Role), selectedRole);
                data = userData.Where(p => p.Role == selected);
            }
            return PartialView(data);
        }

        public ActionResult GetUser(string selectedRole = "All")
        {
            return View((object)selectedRole);
        }

    }

Это вид функций getUser.cshtml по.cshtml по

@using SampleMVC.Models
@model string           

@{
    ViewBag.Title = "GetUser";
    AjaxOptions ajaxOpts = new AjaxOptions
    {
        UpdateTargetId = "tableBody",
        OnBegin = "function1"
    };
}

<script src="~/Scripts/jquery-3.1.1.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

<script type="text/javascript">
    function function1() {
        $("#textbox1").text("function 1 called again");
    }
</script>

<h2>Get User</h2>
<table id="maintable">
    <thead><tr><th>First</th><th>Last</th><th>Role</th></tr></thead>
    <tbody id="tableBody">
        @Html.Action("GetUserData", new { selectedRole = Model })
    </tbody>
</table>

<div id="textbox1">123</div>

@using (Ajax.BeginForm("GetUser", ajaxOpts))
{
    <div>
        @Html.DropDownList("selectedRole", new SelectList(
        new[] { "All" }.Concat(Enum.GetNames(typeof(Role)))))
        <button type="submit">Submit</button>
    </div>
}

Это частичное представление GetUserData.cshtml

@model IEnumerable<SampleMVC.Models.User>

<table id="PartialTable">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.FirstName)
            
        </th>
        <th>
            @Html.DisplayNameFor(model => model.LastName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.BirthDate)
        </th>
        <th></th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.FirstName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.LastName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.BirthDate)
            </td>
            <td></td>
        </tr>
    }

</table>

То, что я пытаюсь достичь, заключается в том, что при изменении выбора поля со списком значения таблицы должны быть отфильтрованы, а тег Div с id=textbox1 должен отображать значение, как указано в function1().

Что я уже пробовал:

Если я заменю свое представление GetUser.cshtml, то оно будет работать нормально и обновит таблицу отфильтрованными значениями. Но он не ведет себя так же, когда я изменяю его, как упоминалось выше.

@using SampleMVC.Models
@model string
@{
ViewBag.Title = "GetUser";
AjaxOptions ajaxOpts = new AjaxOptions {
UpdateTargetId = "tableBody"
};
}
<h2>Get User</h2>
<table>
    <thead><tr><th>First</th><th>Last</th><th>Role</th></tr></thead>
        <tbody id="tableBody">
            @Html.Action("GetUserData", new {selectedRole = Model })
        </tbody>
</table>

@using (Ajax.BeginForm("GetUser", ajaxOpts)) {
    <div>
        @Html.DropDownList("selectedRole", new SelectList(
        new [] {"All"}.Concat(Enum.GetNames(typeof(Role)))))
        <button type="submit">Submit</button>
    </div>
}

---