1

下面是我用来根据我公司目前正在进行的项目数量制作单独 div 的代码。每个 div 包含项目的最新构建是成功还是失败。

我目前将此设置为在 120 到 180 秒之间自动刷新。目前，每个 div 都会同时刷新。我想要它，所以每个 div 都会自己随机刷新。

CSHMTL 创建 div：

@if (Model.Client.ClientStatus != null && Model.Client.ClientStatus.Trim() != "InActive")
{
<div class="span4 dashboard-success">

<div class="well dashboard-well" style="display:none;">
    <div class="loading">Loading...</div>
    <div> 
        <div class="dashboard-link">

            <h3>@Html.ActionLink(Model.Client.ClientName, "Details", new { controller = "Client", ClientId = Model.Client.ClientID })</h3>
        </div>
    </div>
    @foreach (var project in Model.Client.Projects)
    {

        <div>        
            <div class="dashboard-link">
                <h4>@Html.ActionLink(project.ProjectName, "Details/" + project.ProjectID, "project", new { controller = "Client", ClientId = Model.Client.ClientID },
                    new { controller = "Project", ProjectId = project.ProjectID })</h4>

            </div>

      @if (project.ProjectStatus != null && project.ProjectStatus.Trim() != "InActive")
      {
            <table class="build table table-condensed">
                @foreach (var build in project.Builds)
                {          


                    <tr id="@project.ProjectName.Trim().ToLower().Replace(" ", "_").Replace(".", "").Replace("-", "").Replace("[", "").Replace("]", "")@build.BuildConfigID">
                        <td>                            
                            <!--Adds a link back to client project build details-->

                                <a href = @Url.Content("client/" + Model.Client.ClientID.ToString() + "/project/" +
                                        project.ProjectID + "/build/Details/" + build.BuildID)>@build.BuildName</a>

                        </td>
                        <td class="date">
                        </td>
                        <td class="user">   
                        </td>
                        <td class="status">
                        </td>
                    </tr>                 
                }
            </table>
      }
        </div> 
    }
</div>

处理页面刷新的Javascript：

function random(x) {
  return Math.floor(x * (Math.random() % 1))
}

function randomBetween(MinV, MaxV) {
    return MinV + random(MaxV - MinV + 1)
}

$(function () {
    UpdateStatus();
    window.setInterval(UpdateStatus, randomBetween(120000, 180000))
})

这些当前都放置在局部视图中。任何想法或建议将不胜感激。

编辑：UpdateStatus() 的请求代码

function UpdateStatus() {
    $(".dashboard-well").show().css({ 'background-color': "black", 'overflow': "hidden" })
    $(".loading").show()
    $("td").hide()
    $(".status").hide()
    $.ajax
    ({
        url: "/Build/AllStatuses", //New ULRs
        dataType: 'json',
        success: function (buildstatuses) {

            for (var i in buildstatuses) {
                var status = buildstatuses[i];
                var statusColor = 'black';
                switch (status.status) {
                    case "SUCCESS":
                        statusColor = "green";
                        break;
                    case "FAILURE":
                        statusColor = "#99182C";
                        break;
                    case "ERROR":
                        statusColor = "#CD950C";
                        break;
                    default:
                        statusColor = "black";
                        break;
                }
                var rowID = $.trim(new String(status.teamCityProject).toLowerCase().replace(/ /g, "_").replace(/\./g, "").replace(/-/g, "").replace(/\[/g, "").replace(/]/g, "")) + status.id;


                $("tr#" + rowID + " td.status").html(status.status).css({ 'color': statusColor, 'font-weight': 'bolder' })
                if (status.status != "SUCCESS") {



                    var row = $("tr#" + rowID)

                    row.parent().parent().parent().parent().parent().removeClass("dashboard-success").addClass("dashboard-fail");

                    row.parent().parent().prepend(row.clone());  // Places Failure at the top by cloning then removing
                    row.remove();

                }

                $("tr#" + rowID + " td.date").html(status.date)
                $("tr#" + rowID + " td.user").html(status.user)

                // jQuery show hide
                $(".loading").hide()
                $(".dashboard-well").show().css({ 'background-color': "#D8D8D8", 'overflow': "auto" })
                $(".status").show()
                $("td").show()


            }

            //Sets Failed results to the left
            $("div.dashboard-fail").each(function () {

                var div = $(this);

                div.parent().prepend(div.clone());
                div.remove();

            });

            // Scroll to the bottom of the Div defined and scroll up --> See scroll function at top

            scrollDown();
            scrollUp();
            scrollDown();
        }

    })
}
</script>
4

2 回答 2

1

尝试以下方式：

<script type="text/javascript">
$(function () {
    UpdateStatus("@Model.Client.ClientID")
    var random = randomBetween(120000, 180000)

    window.setInterval(function(){
        UpdateStatus("@Model.Client.ClientID")
    }, random)
})
 </script>

这将被添加到您的 .cshtml 页面中，这将调用 UpdateStatus 函数，我认为这在以前没有发生，让我知道这是否有效。

于 2012-06-01T12:56:04.227 回答
-1

我建议不要完全随机刷新这些 div，因为随机性有效地消除了平衡服务器压力的可能性。

因此，我建议您使用随机计数器触发更新波，它将更新单个 div，获取新版本，然后更新下一个。如果您有许多 div，那么一次更新多个容器可能是值得的（因此该波实际上在下一波开始之前完成）。为 wave 设置随机开始允许您让多个客户端在不同时间更新其 div 容器 - 这可以平衡服务器上的并发压力。

对于更新单个 div，我建议修改您的 UpdateStatus() 函数，以便它更新由 ProjectID 标识的特定项目（您似乎可以访问此信息，所以为什么不使用它）。当 UpdateStatus(ProjectID) 函数完成时，您获取包含此项目信息的 div 并相应地更新它。

于 2012-05-30T14:17:39.857 回答