CODEWITHSUNDEEP
javascriptangularjsangularjs-ng-repeat
TJF
TJF

Reputation: 1101

angularjs adding selected items from dropdowns to the scope

I have a table which has a dropdown above each column where the number of columns is dynamic. I created this as follows

            <table class='table' >
                <tr>
                    <th ng-repeat= "item in importTable[0]">
                        <select ng-model="selectedItem" ng-options="i.Name for i in optionList"></select>
                    </th>
                </tr>
                <tr ng-repeat="row in importTable">
                    <td ng-repeat="item in row">{{ item }} </td>
                </tr>
            </table>

Where optionList is the list of options in the dropdowns. All of the dropdowns have the same optionList.

How do I add the selected item along with the index of the column it is above to the scope to the model?

Here is a link to JSfiddle http://jsfiddle.net/U3pVM/769/ just click import. I want to be able to define which column is which type.

Upvotes: 0

Views: 1066

Answers (1)

Stewie
Stewie

Reputation: 60416

You may use $index variable that is provided by ngRepeat to set the ngModel to a specific item in an array:

In your controller you first define the array that will hold all the models:

function ImportCtrl($scope) {   
  $scope.selectedItems = [];
  ...
}

And than, inside the ngRepeat you refer your ngModel to a specific item inside the selectedItemsarray:

<select ng-model="selectedItems[$index]" ng-options="i.Name for i in columnNames"></select>

Demo FIDDLE

Upvotes: 1

Related Questions