SetTimeout to update a Partial View in MVC3 executes randomly

Question

I'm working on an application that uses asp.NET mvc3. I created a partial view, and I call this partial view in a view, so that I can update a div without reloading the page. I use setTimeout (but I also tried setInterval) to define the refreshing time. The problem is that it does not work, it refreshes the div randomly, not following the time I set, and there is no logic that I can understand in it, sometimes it refreshes it twice, sometimes it waits, but never longer then the time I set. This is the code of the partial view. In the View I just call the partial view.

<script type="text/javascript">
var st;
function updateDiv() {
    st = null;
    clearTimeout(st);
    console.log("posting");
    $.post('@Url.Action("RefreshSelfUpdatingPartial")', function (data) {
        $('#SelfUpdatingPartialDiv').hide().slideDown("slow").html(data);
        //wait 15 seconds
        st = setTimeout(updateDiv, 15000);
    });
}
updateDiv();
</script>
<div id="SelfUpdatingPartialDiv">
test

</div>

RefreshSelfUpdatingPartial is Action in Controller ? – Kiquenet Dec 10 '18 at 17:06 — Kiquenet, Dec 10 '18 at 17:06

score 2 · Accepted Answer · answered Aug 10 '11 at 07:41

2

"This is the code of the partial view. In the View I just call the partial view."

If all of the above code is in the partial view, doesn't that mean that the $.post() is going to then load all of the above into the <div>, resulting in a second copy of the above nested inside itself? As the timeouts run it'll just keep nesting more and more copies inside itself.

I'd suggest you move all of the above into your main view, then the partial view should return only whatever text you want to see in the <div> (and no JavaScript).

(If that's not what you meant by the statement I quoted then please update your post to explain more clearly where the above code sits and what the $.post('@Url.Action("RefreshSelfUpdatingPartial")) actually returns.)

(Plus, like Alex said, don't set your st variable to null before you pass it to clearTimeout() - though I think you can delete both lines because you don't need to clear a timeout after it's already triggered.)

answered Aug 10 '11 at 07:41

nnnnnn

147,572
30
200
241

I'm just implementing this logic: http://stackoverflow.com/questions/5866326/updatepanel-in-razor-mvc-3/5893922#5893922 To implement an "UpdatePanel" in MVC3. – Attila Aug 10 '11 at 07:58
1

OK, but saying (essentially) "I copied this code from elsewhere" really doesn't address what I was asking about in my first paragraph, especially given that you've already said it doesn't work. To put it another way, when your `$.post()` callback executes what is actually returned in the `data` parameter? Please use `console.log(data);` to find out and get back to me. – nnnnnn Aug 10 '11 at 08:08
Ok Now I understand what you were asking me, I used the console.log(data) and it returns all the exact code I posted in the first post, maybe this is the problem? But it just refreshes the div why should it copying itself in a nested way? – Attila Aug 10 '11 at 08:19
1

Your callback function is setting the contents of the `div` to everything returned in the `data` parameter, which means you end up with two copies of the script, both of which are then trying to update that `div`, and both of which set a timeout - I think that's enough to result in weird random-seeming timing. So please try what I already suggested: move _all_ of your code into your main view (including the script and the div), and then in your partial view just return whatever text you want to see inside the `div` (without the `div` tag itself, just the contents). – nnnnnn Aug 10 '11 at 08:25
@Atilla, you mean the returned data also includes the script in your question? There's your problem then. – Alex R. Aug 10 '11 at 08:26
That was the problem! Thanks a lot :) – Attila Aug 10 '11 at 08:35

SetTimeout to update a Partial View in MVC3 executes randomly

1 Answers1