When looping over Dataobject, how to display 2 records per column? - twitter-bootstrap-3

Question

When looping over a DataObject how do you only display 2x items per column e.g
I need to display the locations as per this design which has 4 columns. I am using boostrap for the columns.
I have a Location.php Dataobject
class Location extends DataObject {
public static $default_sort = 'Sort';
private static $db = array(
'Sort' => 'Int',
'City' => 'Varchar(255)',
'Address' => 'Text',
'PhoneNumber' => 'Varchar(255)'
);
private static $has_one = array(
'SiteConfigExtension' => 'SiteConfig',
);
private static $summary_fields = array(
'City',
'Address',
'PhoneNumber',
);
}
In my template .ss I have this
<% with $SiteConfig %>
<% loop Locations %>
<div class="col-md-3">
<div class="location-$Pos">
<h6>$City</h6>
<div>$Address</div>
<div>$PhoneNumber</div>
</div>
</div>
<% end_loop %>
<% end_with %>
Obviously atm this creates a new column for each record in the Dataobject.

Answer 1

You can use $First $Last and $MultipleOf(x). The below will display 2 columns per row. Change MultipleOf(2) to another number to display a different number of columns per row. MultipleOf(3) = 3 columns per row, MultipleOf(4) = 4 columns per row, etc. You will need to update the css class names.
<% with $SiteConfig %>
<% loop Locations %>
<% if First %>
<div class="row">
<% end_if %>
<div class="col-md-6">
<div class="location-$Pos">
<h6>$City</h6>
<div>$Address</div>
<div>$PhoneNumber</div>
</div>
</div>
<% if MultipleOf(2) %>
</div><% if not Last %><div class="row"><% end_if %>
<% else %>
<% if Last %></div><% end_if %>
<% end_if %>
<% end_loop %>
<% end_with %>