How do i get the value from an item-select within an ng-repeat?

ionic-v1
1

I have an item select within an ng-repeat. How would I go about grabbing the value of each item-select within my ng-repeat?

Here is some code to give you an example of what i’m dealing with.

        <ion-list>
        <label class="item item-input item-select rounded" ng-repeat="disability in disabilities" style="margin-bottom: 10px;">
            <div class="input-label">
                Enter disablity rating {{disability.numbered}}:
            </div>
            <select>
                <option selected>10%</option>
                <option>20%</option>
                <option>30%</option>
                <option>40%</option>
                <option>50%</option>
                <option>60%</option>
                <option>70%</option>
                <option>80%</option>
                <option>90%</option>
            </select>
        </label>
    </ion-list>

Thanks in advance!

2 
        <select ng-model="selectedValue">
            <option selected>10%</option>
            <option>20%</option>
            <option>30%</option>
            <option>40%</option>
            <option>50%</option>
            <option>60%</option>
            <option>70%</option>
            <option>80%</option>
            <option>90%</option>
        </select>
1 Like
3

That worked great thanks!

The only problem I have now is that I can’t seem to get a default selection going. I have tried both the way listed above and the way posted below but I am getting a blank box either way.

        <!-- List of Percentages -->
    <ion-list>
        <label class="item item-input item-select rounded" ng-repeat="disability in disabilities" style="margin-bottom: 10px;">
            <div class="input-label">
                Enter disablity rating {{disability.numbered}}:
            </div>
            <select ng-model="disability.value">
                <option ng-selected="selected">10%</option>
                <option>20%</option>
                <option>30%</option>
                <option>40%</option>
                <option>50%</option>
                <option>60%</option>
                <option>70%</option>
                <option>80%</option>
                <option>90%</option>
            </select>
        </label>
    </ion-list>
4

You need to change it to ng-selected="true" or define $scope.selected = true

2 Likes
5

Seems this is the second time you saved me a headache this week brandyshea. Thanks a ton!

To summarize for all those who may have the same problem, my code now looks like the following

Html file:

       <!-- List of Percentages -->
    <ion-list>
        <label class="item item-input item-select rounded" ng-repeat="disability in disabilities" style="margin-bottom: 10px;">
            <div class="input-label">
                Enter disablity rating {{disability.numbered}}:
            </div>
            <select ng-model="disability.value">
                <option value="10" ng-selected="true">10%</option>
                <option value="20">20%</option>
                <option value="30">30%</option>
                <option value="40">40%</option>
                <option value="50">50%</option>
                <option value="60">60%</option>
                <option value="70">70%</option>
                <option value="80">80%</option>
                <option value="90">90%</option>
            </select>
        </label>
    </ion-list>

Controller file:

       $scope.calculateTotal = function(){

        var DEFAULT_SELECT_VALUE = 10;

        //sets the default value for the selectors
        for(var disab in $scope.disabilities){
            if($scope.disabilities[disab].value == undefined)
                $scope.disabilities[disab].value = DEFAULT_SELECT_VALUE;

            console.log($scope.disabilities[disab].value);
        }

        var efficencyMultiplier = 100, efficencyRemainder = 100, total = 0;

        //calculate disability total
        for(var disab in $scope.disabilities) {
            var input = parseInt($scope.disabilities[disab].value);
            if(disab > 0){
                efficencyRemainder = (efficencyMultiplier * input / 100);

                efficencyMultiplier = efficencyMultiplier - efficencyRemainder;

                total = total + efficencyRemainder;
            }else{
                efficencyMultiplier = efficencyRemainder - input;

                total = input;
            }

            console.log("Efficiency Multiplier: " + efficencyMultiplier + " Efficiency Remainder: " + efficencyRemainder + " Total: " + total);
        }
        //make our local variable equal to our service, they now point to the same address...pointers
        DisabilityCalcCtrl.finalResult = finalResult;

        //set our service variable here to send it over to our result page
        DisabilityCalcCtrl.finalResult.value = total.toFixed(2);
    }
3 Likes