Countdown time using Partial Razor page

Question

User148055990 posted

I'd like to embed a partial page in a Razor page that will show then number of seconds remaining once a timer has been started. The number of seconds would begin at say 100 seconds and should update every 10 seconds on the partial page without causing the parent Razor page to update. This is for a quiz application with a number of Razor pages and if the questions of the first page are completed the user would move to the second page which would also include the partial which would continue to show the number of seconds remaining for the whole quiz. Can anyone point me in the right direction please.

Answer 1

User1724605321 posted

Hi kiboko ,

You can try below two ways :

1.  Use setInterval() function. Simply give this function a callback and a timeout period (in milliseconds) as arguments and it will call your function every X milliseconds. Use Ajax to dynamically load the partial view : 

https://stackoverflow.com/questions/22622508/how-can-i-automatically-update-a-partial-view 

https://stackoverflow.com/questions/39486645/auto-refresh-partial-view-with-jquery

https://stackoverflow.com/questions/6840140/jquery-ajax-call-with-a-timer 

2.  After the first time partial view loaded .Directly update the html/element of the view using JavaScript with timer , not need to use ajax to load the partial view again .

Best Regards,

Nan Yu

Answer 2

User148055990 posted

Thank you Nan Yu for your reply, and for the links you provided.

I think I will try to go with SignalR as it seems the best alternative for my needs.

regards

Kiboko