How do I refresh a partial view every 3 seconds in MVC 4?
I think you need to make some changes to your ajax call. Here is an example of how I do the call
$.ajax({
url: '@Url.Action("Action", "Controller")',
type: 'post',
cache: false,
async: true,
data: { id: "frmUser" },
success: function(result){
$('.divPartial').html(result);
}
});
on your controller I don't think you need the child action only. Also you are returning an empty partial view object. It should be
return partialView('_partialName', Model);
finally in your jquery to keep the call happening you need to retrigger the call. Try something like this
$(document).ready(function(){
function RefreshPartial(){
//this will wait 3 seconds and then fire the load partial function
setTimeout(function(){
loadPartialView();
//recall this function so that it will continue to loop
RefreshPartial();
}, 3000);
}
//initialize the loop
RefreshPartial();
});
antman1p
C#, Java, XAML, and Shell Script coder. Start my own business dealing with Simulations for UAS training.
Updated on June 05, 2022Comments
-
antman1p almost 2 years
I need to get a progress bar to update based on the number of jobs completed. The number of jobs completed is stored on a jobs table of a SQL Server DB. I need my ASP.NET MVC 4 application to query the DB every 3 seconds for the number of jobs compete and use this data to update the progress bar which is held in a partial view. The timer works and it calls my the _getforStatus action in the StatusController, and it seems to call the EntityDB, but is never seems to call the view other than before the timer tells it to. How do I get the progress bar to refresh every 3 seconds?
The header of my _Layout.cshtml view calls the initiation of the timer which is in the StatusController like so:
<head> ... @Html.Action("InitTimer", 'Status") ... </head>
Also, in the _Layout view I call the partial view into a Jumbotron like so:
<div class="jumbotron" id=progress"> @{Html.RenderAction("_GetforStatus", "Status");} </div>
The Status controller is coded like so:
public class StatusController : Controller { IntegrationDBEntities _db; Private Timer timer1; Public void initTimer() { timer1 = new Timer(); timer1.elapsed += new ElapsedEventhandler(timer_Elapsed(; timer1.interval = 3000; timer1.Start(); } Private void timer_Elapsed(Object sender, EventArgs e) { _GetforStatus(); } [ChildActiononly] public PartialViewResult _GetforStatus(0 { _db = new IntegrationDBEntities(); ViewDataModel - _db.Jobs.ToList(); return partialView(); }
EDIT: I also tried the following Ajax code. I got no error, but my progress bar never updated:
<script> function loadPartialView() { $.ajax({ url: '@url.Action("_GetforStatus', "Status")", type: 'GET', dataType: 'html', success: function(result) { $('progress').html(result); } }); } $function () { loadPartialView(); window.setInterval("loadPartialView()", 3000); }); </script>
I'm not sure if it isn't working bc i haven't represented "Html.RenderAction" in JS correctly or what.