Preselect uib-btn-radio button

I have the following btn-group

<div class="btn-group">
      <label class="btn btn-success active" data-ng-model="myModel" uib-btn-radio="'enabled'"  data-ng-click="vm.myFunction()">
           Enabled
       </label>
       <label class="btn btn-success" data-ng-model="myModel" uib-btn-radio="'disabled'" data-ng-click="vm.myFunction()">
            Disabled
        </label>
 </div>

When the page is been displeyed angular adds two classes ng-pristine and ng-untouched and remove class active from the first radio button like the following.

<label class="btn btn-success ng-pristine ng-untouched ng-valid waves-effect" data-ng-model="vm.statusFilter" uib-btn-radio="'enabled'" data-ng-click="vm.filterGridByStatus()">
    Enabled
</label>

Answers


Let the directive handle the active state. In your controller, assign the active button to the model.

$scope.myModel = 'enabled';

http://codepen.io/tsneville/pen/aNWoNd


You can select using ng-class.

HTML...

<div class="btn-group btn-group-TopSubform">
                <label ng-class="buttonSelectedInButtonGrp" ng-model="radioModel" uib-btn-radio="'Left'">Primary Location1</label>
                <label class="btn btn-lg btn-success" ng-model="radioModel" uib-btn-radio="'Middle'">Other Locations</label>
            </div>

Angular Controller (or could be shifted into a directive) ...

$scope.buttonSelectedInButtonGrp = "btn btn-lg btn-success ng-untouched ng-valid ng-dirty active ng-not-empty ng-valid-parse";

Note that this is different to the unselected class list which is... btn btn-lg btn-success ng-pristine ng-untouched ng-valid ng-empty

The css can be edited as...

.btn-success.active {
        border-color:darkblue;
        border-width:medium;
}

.btn-success {
    border-color:none;
    border-width:medium;

}

Need Your Help

Polymer Elements from .5 to 1.0

polymer polymer-1.0

My team and I are updating our project from Polymer 0.5 to Polymer 1.0. Is there a list of which core and paper 0.5 elements will be transitioned to 1.0 and which ones will not be? E.G. core-ajax has

How to run math action/function from a list in a specific order at any called time, one by one

java

I'm trying to build an algorithm in java, which in ugly way looks like this: