部分视图中的数据表在通过 ajax 请求加载后立即对齐

Question

我从局部视图加载了数据表。当它加载控制器时，它工作正常并保持在正确的位置。但是当我通过调用 ajax 数据表重新加载数据表时，数据表右对齐。

请注意，我正在使用 signalR，当 SqlDependency 通知更改时 ajax 正在触发。

局部视图：

@model Model.Contest
@Html.Hidden("NotifierEntity", (object)ViewBag.NotifierEntity)
<table id="Standings" class="table table-bordered table-hover" >

@if (Model.Participants != null)
{
    char a = 'A';
    <thead>
    <tr>
        <th>Rank</th>
        <th>Name</th>
        <th>Score</th>

        @foreach (var item in Model.Problems.OrderBy(x => x.ProblemName))
        {
            <th>
                @a
            </th>
            a++;
        }

    </tr>
    </thead>

    <tbody>
    @{ int i = 0;}
    @foreach (var item in Model.Standings.OrderByDescending(p => p.score))
    {
        i++;
        <tr>
            <td>@i</td>
            <td>@item.Participant.Id</td>
            <td>
                @item.score
            </td>
            @foreach (var mal in Model.Problems.OrderBy(x => x.ProblemName))
            {

                <td>
                    <button type="button" class="btn btn-success">
                        @if (@Model.Submissions.Where(c => c.Participant.Id == item.Participant.Id && c.Problem.Id == mal.Id && c.CompilerComment == "Accepted") != null)
                        {
                            @Model.Submissions.Where(c => c.Participant.Id == item.Participant.Id && c.Problem.Id == mal.Id && c.CompilerComment == "Accepted").Count()
                            ;
                        }
                        else
                        {
                            <p>0</p>
                        }

                    </button>

                    <br />
                    <button type="button" class="btn btn-danger">
                        @if (@Model.Submissions.Where(c => c.Participant.Id == item.Participant.Id && c.Problem.Id == mal.Id && c.CompilerComment != "Accepted") != null)
                        {
                            @Model.Submissions.Where(c => c.Participant.Id == item.Participant.Id && c.Problem.Id == mal.Id && c.CompilerComment != "Accepted").Count()
                        }
                        else
                        {
                            <p>0</p>
                        }

                    </button>

                </td>
            }
            @*<td>
                            @Html.DisplayFor(modelItem => item.TimeLimit)
                        </td>
                        <td></td>*@

        </tr>
    }
    </tbody>
}

@section scripts{


    <script>
        $(document).ready(function () {
            $("#Standings").DataTable();
        });
    </script>
    <script src="@Url.Content("~/Scripts/val.js")"></script>
}

我的 ajax 在原始视图中的请求：

$.post('@Url.Action("StandingPartial", "Contest", new { id = @contestId }, Request.Url.Scheme)')
            .done(function (response) {
                $("#standings").html(response)
                if (!signalRHubInitialized)
                    InitializeSignalRHubStore();
            });

没有ajax的图像：

带有 ajax 请求的图像：

Answer 1

局部视图控制器的结构应该是：

    public ActionResult StandingPartial(Guid Id)
    {
        return PartialView(model);
    }

但是我写了 return View(model); 而不是

部分视图中的数据表在通过 ajax 请求加载后立即对齐

Datatable in a partialview is aligning right after loading it by ajax request

asp.net-ajax

datatables

asp.net-mvc-partialview