title: Dynamic Row add + drop down based selection in angularjs
body: <p>Very new to angularjs, so please forgive me if it is easy one.</p>
  
  <p>I want to create dynamic rows for input fields,combobox using angularjs's   ng-repeat . When we choose an item from combobox it will display uom,product_mrp of that particular product. and when quantity is typed its calculation is displayed in another column.Now My problem is, 
  When i click on add new row,it will add one row and when we select combo box in    that particular row it will override the previous rows values in textbox</p>
  
  <p>My Html Code</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
      &lt;html ng-app="plunker"&gt;
      &lt;head&gt;
          &lt;meta charset="utf-8" /&gt;
          &lt;title&gt;AngularJS Plunker&lt;/title&gt;
          &lt;script&gt;document.write('&lt;base href="' + document.location + '" /&gt;');&lt;/script&gt;
          &lt;link rel="stylesheet" href="style.css" /&gt;
          &lt;script data-require="angular.js@1.2.x" src="http://code.angularjs.org/1.2.15/angular.js" data-semver="1.2.15"&gt;&lt;/script&gt;
          &lt;script src="script.js"&gt;&lt;/script&gt;
        &lt;/head&gt;
  
      &lt;body&gt;
        &lt;div  ng-controller="MainCtrl"&gt;
          &lt;table frame="box" rules="all"&gt;
            &lt;thead&gt;
  
  
              &lt;tr&gt;
  
                &lt;th&gt;Description&lt;/th&gt;`enter code here`
                &lt;th&gt;Quantity&lt;/th&gt;
                &lt;th&gt;UOM&lt;/th&gt;
                &lt;th&gt;Unit Price&lt;/th&gt;
                &lt;th&gt;Amount&lt;/th&gt;
                &lt;th&gt;Remarks&lt;/th&gt;
                &lt;th&gt;&lt;/th&gt;
              &lt;/tr&gt;
            &lt;/thead&gt;
            &lt;tbody&gt;
  
              &lt;tr&gt;&lt;/tr&gt;
              &lt;tr ng-repeat="r in rows"&gt;
                &lt;td&gt;
                  &lt;select ng-model="p.item_description" ng-change="getProductDetails(p.item_description)" ng-options="p.item_code as p.item_description for p in product"&gt;
                    &lt;option value=""&gt;Select Product&lt;/option&gt;
                  &lt;/select&gt;
                &lt;/td&gt;
                &lt;td&gt;
                  &lt;input type="text" style="width: 80px" ng-model="p.quantity" value="0" /&gt;
                &lt;/td&gt;
                &lt;td&gt;
                  &lt;input type="text" disabled="disabled" style="width: 80px" ng-model="nrows.uom" /&gt;
                &lt;/td&gt;
                &lt;td&gt;
                  &lt;input type="text" style="width: 80px" disabled="disabled" ng-model="nrows.product_mrp" value="0" /&gt;
                &lt;/td&gt;
                &lt;td&gt;{{r.amount=p.quantity*nrows.product_mrp| currency}}&lt;/td&gt;
  
                &lt;td&gt;
                  &lt;textarea name="message" id="message" class="form-control" rows="2" cols="20" required="required" placeholder="Remarks" ng-model="r.remarks"&gt;&lt;/textarea&gt;
                &lt;/td&gt;
                &lt;td&gt;
  
  
                  &lt;div class="text-center"&gt;
                    &lt;button ng-click="addRow()"&gt;Add Row&lt;/button&gt;
  
                  &lt;/div&gt;
                &lt;/td&gt;
              &lt;/tr&gt;
  
              &lt;tr&gt;
  
  
                &lt;td&gt;&lt;/td&gt;
                &lt;td&gt;&lt;/td&gt;
                &lt;td&gt;&lt;/td&gt;
                &lt;td&gt;
                  &lt;h4&gt;TOTAL :&lt;/h4&gt;
                &lt;/td&gt;
                &lt;td&gt;
                  &lt;h4&gt;
                                                  &lt;strong&gt;{{total_amount() |currency}}&lt;/strong&gt;
                                              &lt;/h4&gt;
                &lt;/td&gt;
                &lt;td&gt;&lt;/td&gt;
                &lt;td&gt;&lt;/td&gt;
              &lt;/tr&gt;
            &lt;/tbody&gt;
          &lt;/table&gt;
        &lt;/div&gt;
      &lt;/body&gt;
  
      &lt;/html&gt;
  </code></pre>
  
  <p>Javascript</p>
  
  <pre><code>var app = angular.module('plunker', []);
  
  app.controller('MainCtrl', function($scope) {
    $scope.rows = [{}];
    $scope.nrows = [];
    $scope.addRow = function() {
      $scope.rows.push({
  
      });
  
    };
      $scope.getProductDetails=function(id){
  
      angular.forEach($scope.product, function(p) {
  
              if(p.item_code==id)
                  {
                  $scope.nrows.uom=p.uom;
                  $scope.nrows.product_mrp=p.product_mrp;
                  console.log(p.item_description+" "+p.uom+" "+p.product_mrp);
                  }
              else
                  {
  
                  }
  
  
  
          })
      }
      $scope.total_amount = function() {
  
          var total = 0;
          $scope.rows.forEach(function(row) {
  
              total += row.amount;
  
          })
  
          return total;
      }
  
  
  $scope.product= [{
      "item_code": 1001,
      "uom": "Nos.",
      "product_mrp": 12,
      "item_description": "CHOCO FILL 250GM"
    }, {
      "item_code": 1002,
      "uom": "Nos.",
      "product_mrp": 38,
      "item_description": "LUX GOLD 75GM"
    }, {
      "item_code": 1003,
      "uom": "Nos.",
      "product_mrp": 20,
      "item_description": "CHOCO BAR"
    }, {
      "item_code": 1004,
      "uom": "Nos.",
      "product_mrp": 15,
      "item_description": "CASATA"
    }, {
      "item_code": 1005,
      "uom": "Nos.",
      "product_mrp": 12,
      "item_description": "GOOD DAY 100GM"
    }, {
      "item_code": 1006,
      "uom": "Nos.",
      "product_mrp": 18,
      "item_description": "Garam Masala"
    }, {
      "item_code": 1007,
      "uom": "Nos.",
      "product_mrp": 25,
      "item_description": "VIVEL SOFT 75GM"
    }, {
      "item_code": 1008,
      "uom": "Nos.",
      "product_mrp": 45,
      "item_description": "SUNLIGHT 500GM"
    }, {
      "item_code": 1009,
      "uom": "Nos.",
      "product_mrp": 65,
      "item_description": "Dove 75gm"
    }, {
      "item_code": 1010,
      "uom": "Nos.",
      "product_mrp": 38,
      "item_description": "NIRMA 250GM"
    }, {
      "item_code": 1011,
      "uom": "Nos.",
      "product_mrp": 150,
      "item_description": "FOUNDATION CREAM"
    }]
  });
  </code></pre>
  
  <p><a href="http://plnkr.co/edit/iip3u8BrXgWi0is60iFq?p=preview" rel="nofollow">http://plnkr.co/edit/iip3u8BrXgWi0is60iFq?p=preview</a></p>