nervartha
nervartha

Reputation: 75

get value of textfield in a table using angularjs

Below is my angularjs form

<div ng-app="Myapp">
    <div ng-controller="orderFormController">
        <table  id="item_table">
            <thead>
                <tr class="headings">
                    <th class="column-title">Item </th>            
                    <th class="column-title">Rate</th>                          

                    </th>

                </tr>
            </thead>

            <tbody>
                <tr>
                    <td>         
                        <select name="item"  ng-model="item" >
                            <option value="">Choose..</option>
                            <option value="T-SHIRT">T-SHIRT</option>
                            <option value="JACKET">JACKET</option>

                        </select>
                    </td>

                    <td class=" "><input type="text" name="rate"  ng-model='rate'> </td>

                </tr>
                <tr>
                    <td>         
                        <select name="item1"  ng-model="item1" >
                            <option value="">Choose..</option>
                            <option value="T-SHIRT">T-SHIRT</option>
                            <option value="JACKET">JACKET</option>

                        </select>
                    </td>

                    <td class=" "><input type="text" name="rate1"  ng-model='rate1'> </td>

                </tr>


            </tbody>

        </table>
        <button type="button"  ng-click='saveorder()' >SAVE ORDER</button>
    </div>    

 <script>
        Myapp.controller('orderFormController', ['$scope', '$http', function ($scope, $http) {
            var data = {};
            data['item'] = [];
            $scope.saveorder = function () {
                var rowCount = $('#item_table tr').length;
                for (i = 1; i < rowCount; i++) {
                    data['item'][i] = {'item': $scope.item + i, 'rate': $scope.rate + i}
                    //data['item'][i] = {'item': $scope.item,  'rate': $scope.rate}
                }
            }

        });
    </script> 

Here in this above for loop the second commended line is working and it returns value of item, But I want to get all items value in table. When I use item+i in loop it returns a null value means its not working like $scope.item1,$scope.item2 etc. I am new to angularJs any help? thanks in advance

Upvotes: 1

Views: 1636

Answers (1)

ranakrunal9
ranakrunal9

Reputation: 13558

Try by changing your column and type name to use like order_no[0], order_no1, etc.. and type[0], type1, etc.. and check with code below :

var rowCount = $('#item_table tr').length;
for (i = 0; i < rowCount; i++) {
    order_no[i] =  $scope.order_no[i];
    type[i] =  $scope.type[i];
}

You can check fiddle https://jsfiddle.net/qh73ogzw/30 to check changed example as per your code

Upvotes: 1

Related Questions