Ajax请求不更新部分视图

时间:2016-10-31 02:16:48

标签: jquery ajax asp.net-mvc webgrid

嘿伙计们只是想知道我是否正确地执行此操作我在我的页面上有一个名为_webgrid的部分视图,被一个名为index的视图使用。我的控制器使用以下函数的API来填充此webgrid的数据

public ActionResult Index()
    {
        ViewBag.Message = "Your MyList page.";
        var computeHelper = AzureAccess.GetComputeHelper();
        var model = computeHelper.GetVmListGrouped();
        if (Request.IsAjaxRequest())
            return PartialView("_webgrid", model);
        else
            return View(model);
    }

现在我在索引视图中调用我的ajax请求,就像这样

<script>

    (function () {
        setInterval(function () {
            $.ajax({
                url: '@Url.Action("Index", "Home")',
                success: function (response) {
                        alert(response);
                        $("#partial").html(response);
                    },
            });
        }, 5000);
    });

</script>

理论上应该每隔5秒刷新一次

<div id="partial">
            @Html.Partial("_webgrid", Model)
        </div>

我的部分看起来像这样

@model  List<CSPortal.Library.VirtualMachineGroups>

@foreach (var item in Model)
{
var grid = new WebGrid(source: item.VirtualMachineList, defaultSort: "HostName", ajaxUpdateContainerId: "ajaxgrid");
//div element for each group
<div class="h3">@item.Name</div>
            <div>
                <button type="submit" class="btn btn-primary" onclick="SetCommandValues(@Convert.ToInt32(CSPortal.Library.CsCommand.Start), '@item.Name', @Convert.ToInt32(@CSPortal.Library.CsResourceType.VirtualMachineGroup))">Start</button>
                <button type="submit" class="btn btn-primary" onclick="SetCommandValues(@Convert.ToInt32(CSPortal.Library.CsCommand.Stop), '@item.Name', @Convert.ToInt32(@CSPortal.Library.CsResourceType.VirtualMachineGroup))">Stop</button>
            </div>
//full address:s: cubesysaueast.cloudapp.net:54060
//generate VM details for group
<div class="h6"></div>
            <div id="grid" class="">
                @grid.GetHtml(
      htmlAttributes: new { id = "ajaxgrid" },
      tableStyle: "webgrid-table",
      headerStyle: "webgrid-header",
      footerStyle: "webgrid-footer",
      alternatingRowStyle: "webgrid-alternating-row",
      selectedRowStyle: "webgrid-selected-row",
      rowStyle: "webgrid-row-style",
      columns: grid.Columns(
         grid.Column("", format: (vm) =>
         {
             if (vm.PowerState == "Started") //Display image of status of VM
             {
                 return new HtmlString("<img class=\"img-responsive\" src = " + Url.Content("~/Content/onstate.png") + " style =\"width: 20px; height: 20px; \">");
             }

             else
             {
                 return new HtmlString("<img class=\"img-responsive\" src = " + Url.Content("~/Content/offstate.png") + " style =\"width: 20px; height: 20px; \">");
             }
         }),
         grid.Column("HostName"),
         grid.Column("DeploymentName"),
         grid.Column("ServiceName"),
         grid.Column("InstanceSize"),
         grid.Column("InstanceStatus"),
         grid.Column("IPAddress"),
         grid.Column("PowerState", format: (vm) =>
         {
             if (vm.PowerState == "Stopped") //Choose font colour depending on the status of the VM
             {
                 return new HtmlString("<font color = black>" + vm.PowerState + "</font>");
             }

             else if (vm.PowerState == "Started")
             {
                 return new HtmlString("<font color = Green>" + vm.PowerState + "</font>");
             }
             else
             {
                 return new HtmlString("<font color = Orange>" + vm.PowerState + "</font>");
             }
         }),
         grid.Column(columnName: "Start", style: "webgrid-button-column", format: (vm) =>
         {
             if (vm.PowerState == "Started" || vm.PowerState == "Starting") //if VM is already started/starting disable the Start button as it's not needed
             {
                 return new HtmlString("<button type=\"submit\" class=\"btn btn-primary\" disabled onclick=\"SetCommandValues(" + @Convert.ToInt32(CSPortal.Library.CsCommand.Start) + ", '" + vm.HostName + "', " + @Convert.ToInt32(@CSPortal.Library.CsResourceType.VirtualMachine) + ")\">Start</button>");
             }
             else
             {
                 return new HtmlString("<button type=\"submit\" class=\"btn btn-primary\" onclick=\"SetCommandValues(" + @Convert.ToInt32(CSPortal.Library.CsCommand.Start) + ", '" + vm.HostName + "', " + @Convert.ToInt32(@CSPortal.Library.CsResourceType.VirtualMachine) + ")\">Start</button>");
             }
         }),
         grid.Column(columnName: "Stop", style: "webgrid-button-column", format: (vm) =>
         {
             if (vm.PowerState == "Stopped") //if VM is already started disable the Stop button as it's not needed
             {
                 return new HtmlString("<button type=\"submit\" class=\"btn btn-primary\" disabled onclick=\"SetCommandValues(" + @Convert.ToInt32(CSPortal.Library.CsCommand.Stop) + ", '" + vm.HostName + "', " + @Convert.ToInt32(@CSPortal.Library.CsResourceType.VirtualMachine) + ")\">Stop</button>");
             }
             else
             {
                 return new HtmlString("<button type=\"submit\" class=\"btn btn-primary\" onclick=\"SetCommandValues(" + @Convert.ToInt32(CSPortal.Library.CsCommand.Stop) + ", '" + vm.HostName + "', " + @Convert.ToInt32(@CSPortal.Library.CsResourceType.VirtualMachine) + ")\">Stop</button>");
             }
         }
         )),

                     numericLinksCount: 5
                 )
            </div>
}

但是我发现我的数据源发生了变化,而且我不确定如何开始解决这个问题,任何想法?

修改

感谢Stephens帮助最终的工作脚本如下

<script>
    setInterval(function () {
        $.ajax({
            url: "@Url.Action("Index","Home")",
            success: function (response) {
                $("#partial").html(response);
            },
        });

    }, 15000);

</script>

0 个答案:

没有答案