Bootstrap Grid with MVC.

Question

I have a List details , i have to show 4 vendors in a row and then another 4 vendor in other row and so on but when i loop through model whole list is displaying in single row how to break and create row after 4 objects only??

Sachin Singh · Accepted Answer

the wrong approach is to use for loop and use a counter to check if counter is 4 then create a new row. But the ultimate solution is to create an extension method to split list into chunks of 4 object so that you do not have to do anything in view. public   static   class  ArrayExtensions   {               public   static  IEnumerable > Split ( this  T[] array,  int  size)       {            for  (var i = 0; i  float )array.Length / size; i++)           {               yield  return  array.Skip(i * size).Take(size);           }       }   }         @model IEnumerable    @ using  BootstrapGridLayout;   @{       ViewBag.Title =  "Home Page" ;   }      @ foreach  (var row  in  Model.ToArray().Split(4))   {        class = "row" >           @ foreach  (var article  in  row)           {                class = "col-md-3" >                    class = "thumbnail" >                        "@article.Thumbnail"  data-holder-rendered= "true"  style= "height: 200px; width: 100%; display: block;" >                        class = "caption" >                            "thumbnail-label" >@article.Name                             @article.Description                                                                        }           }

Puja Aggarwal · Answer

thank you worked perfectly.