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

问题描述 投票:0回答:1

我从局部视图加载了数据表。当它加载一个控制器时,它工作正常,并保持在正确的位置。但是当我通过调用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的图片:without ajax

带有ajax请求的图片:image with ajax

datatables asp.net-ajax asp.net-mvc-partialview
1个回答
0
投票

部分视图控制器的结构应该是:

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

但我写了返回View(模型);代替

© www.soinside.com 2019 - 2024. All rights reserved.