Ajax表加载

I am using Ajax call to load the table but I am getting Blank page as Return , Data is not displaying in table Div,

I have tried with $('#groupTable').load(data); as well but no luck , Please help me to resolve the issue.

Ajax Call

$.ajax({
            type: "POST",
            url: url,
            dataType: "json",
            data: { groupNames: JSON.stringify(buttonId), page: JSON.stringify(page) },
            success: function (data) {
                debugger;
                $('#groupTable').html(data);
                updateGroupButtons();
            },
            error: function(request, status, error) {
                debugger;
                $('#groupTable').html(request.responseText);
                updateGroupButtons();
            }
        });

Model

public interface IPagedList : IEnumerable
{
    int PageIndex { get; }
    int PageSize { get; }
    int TotalCount { get; }
    int TotalPages { get; }
    bool HasPreviousPage { get; }
    bool HasNextPage { get; }
    string GroupByNames { get; }
    Dictionary<string, IEnumerable> Group { get; }
}

Controller

public JsonResult GetGroups(string groupNames, int page = 1)
    {
        string[] groups=null;
        if (!string.IsNullOrEmpty(groupNames))
        {
            groups = new JavaScriptSerializer().Deserialize<string[]>(groupNames);
        }

        var model = _unitOfWork.MenuSetRepository.Get().ToPagedList(groups, page, 10);
        return  Json(model, JsonRequestBehavior.AllowGet);
      //  return PartialView("GetGroups",model);
    }

View

<div id="groupTable">
 <table id="tbl" class="table">
            <thead>
                <tr>
                    @foreach (var property in Model.VisibleProperties())
                    {
                        <th draggable="true" ondragstart="drag(event)" id="@property.Name"> @property.GetLabel()</th>
                    }
                    <th>Actions</th>
                </tr>
            </thead>

            @if (string.IsNullOrEmpty(Model.GroupByNames))
            {
                int index = 0;
                <tbody>
                    @foreach (var item in Model)
                    {
                        ViewData[index.ToString()] = item;
                        <tr>
                            @foreach (var property in item.VisibleProperties())
                            {
                                <td>
                                    @Html.Display(index + "." + property.Name)
                                </td>
                            }
                            <td>
                                @{
                                    RouteValueDictionary routevalues = item.GetIdValue();
                                }

                                <li>@Html.ActionLink("Edit", "Edit", routevalues)</li>
                                <li>@Html.ActionLink("Details", "Details", routevalues)</li>
                                <li>@Html.ActionLink("Delete", "Delete", routevalues)</li>

                            </td>

                        </tr>
                        index++;
                    }
                </tbody>
            }
            </table>

    </div>

Have you tried changing this line?

dataType: "json",

to

dataType: "html",

It tells the AJAX call what kind of data to expect from the server. Which I believe you are returning pure HTML?

When you tell AJAX to expect a JSON string then it automatically parses it into the data that it finds, usually an array of values.