MVC Razor render HTML on each iteration of a foreach loop

Question

I am rendering HTML with a foreach loop, like below :

@foreach (var item in list)
 {
     // some html
 }

But it seems that it is iterating the whole loop before starting to render the HTML. I would like to display (render) the html one by one (i.e. if loop iterates 100 times, then it should be render/display the HTML one by one to 100).

Note : To verify that it starts to render the HTML when the loop ends, I did put a thread.sleep(100) inside the loop

@foreach (var item in list)
     {
         Thread.Sleep(100);
         // some html
     }

and if it takes 10 mseconds to start rendering the HTML without sleep then after putting thread.sleep it takes 1000 mseconds before starting to render HTML.

Any suggestion as to what I should do so that the UI doesn't get frozen until the loop completes? It should render the HTML as each iteration completes. Thank you.

Josh · Accepted Answer · 2013-11-09 05:07:17Z

1

If you are doing this inside of a Razor view, then all your HTML will be rendered on the server BEFORE it is sent down to the client.

If you want to render something one by one, then you will have to do that on the client via JavaScript.

answered Nov 9, 2013 at 5:07

Josh

45k7 gold badges106 silver badges125 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

AKD Over a year ago

i noticed on most of the sites the content starts render when a page opens and it keeps loading and further rendering the records/content, What about those ?

AKD Over a year ago

Is there no server side scripting or any way that it could render records one by one ?

Collectives™ on Stack Overflow

MVC Razor render HTML on each iteration of a foreach loop

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related