I created this form with bootstrap 3:
These buttons inside 'btn-group' div, aren't doing anything useful, apart from just displaying some buttons on the screen. They are not aware of any 'selected' property (in order for the selected value to be submitted).
Buttons are not meant to act like radio buttons, checkboxes etc. Their purpose is to perform an action when they are clicked.
So what i recomend is to forget about button group and just add checkboxes. If you are concerned about the styling, just add this very useful library (http://icheck.fronteed.com/). I think line skin will be great for you.
If you really want these buttons, you should write some js code (preferably jquery) and on the click event, store the selected value(s) in a hidden input that will get submitted. See here: Change a hidden input's value with jquery/javascript
I found a solution
<div class="btn-group" data-toggle="buttons">
<label class="btn btn-primary">
<input type="radio" id="NA" name="region" value="NA" autofocus="true"/> NA
</label>
<label class="btn btn-primary">
<input type="radio" id="EUW" name="region" value="EUW" /> EUW
</label>
<label class="btn btn-primary">
<input type="radio" id="EUNE" name="region" value="EUNE" /> EUNE
</label>
<label class="btn btn-primary">
<input type="radio" id="BR" name="region" value="BR" /> BR
</label>
<label class="btn btn-primary">
<input type="radio" id="TR" name="region" value="TR" /> TR
</label>
<label class="btn btn-primary">
<input type="radio" id="RU" name="region" value="RU" /> RU
</label>
<label class="btn btn-primary">
<input type="radio" id="LAN" name="region" value="LAN" /> LAN
</label>
<label class="btn btn-primary">
<input type="radio" id="LAS" name="region" value="LAS" /> LAS
</label>
<label class="btn btn-primary">
<input type="radio" id="OCE" name="region" value="OCE" /> OCE
</label>
</div>