2016-04-04 21 views
0

'daki bir dizi içinde alan verilerini toplayın Formdaki 'satış ekle' düğmesini tıklayarak dinamik olarak form girdi alanları oluşturmalıyım. Bu,Dinamik form girdi alanları oluşturun ve angularJS

'da gerçekleştirilmiştir. Ayrıca, seçilen açılır menüyü değiştirmek için, fiyat veritabanından alınır ve bu ürünün miktarını hesaplamak için miktarı kullanın.

Başka bir form için 'satış ekle' düğmesine tıklarsam, değişiklikler bir öncekini etkiler.

Her form için tutarı bağımsız olarak nasıl hesaplar ve angularJS'yi kullanarak veriyi nasıl toplar?

bu

bu html

<form class="form-inline" role="form" padding-left:10em"> 
        <strong class="error">{{ error }}</strong> 

        <div class="form-group"> 
         <label for="name"> 
          Invoice No. : 
         </label> 
         <input type="text" class="form-control" id="name" ng-model="name" /> 
        </div> 
        <br /><hr /> 
        <div ng-controller="MainCtrl"> 
         <fieldset data-ng-repeat="choice in choices"> 


          <div class="form-group"> 
           <label for="name"> 
            Quantity : 
           </label> 
           <input type="text" class="form-control" id="quantity" ng-model="quantity" /> 
          </div> 

          <div class="form-group"> 


           <div class="form-group"> 
            <label class="control-label"> Product : </label> 
            <select class="form-control" id="selected_id" ng-model="selected_id" ng-options="c.Value as c.Text for c in pcategoryA" 
              ng-change="changedValue(selected_id,quantity)"> 

             <option value="">-- Select Category --</option> 
            </select> 
           </div> 

          </div> 



          <div class="form-group"> 
           <label for="name"> 
            Amount : 
           </label> 
           <input type="text" class="form-control" id="amount" ng-model="amount" ng-readonly="true" />  
          </div> 

          <button class="remove" ng-show="$last" ng-click="removeChoice()">-</button> 
          <br /> 
          <hr /> 

         </fieldset> 
         <button type="submit" class="col-sm-offset-10 addfields" ng-click="addNewChoice()"> 
          Add Sale 
         </button> 
        </div> 


       </form> 

gelişmiş sayesinde kontrolör

appcat.controller("MainCtrl", ['$scope', '$http', '$location', function ($scope, $http, $location) 
{ 
    //var quan = $scope.quantity; 
    $http.get('/api/pproduct').success(function (data) 
    { 
     $scope.pcategoryA = data; 
    }); 

    // this controll the addition and removal 
    $scope.choices = [{ id: 'choice1' }]; 

    //any time changes occurr it calculate the Amount 
    $scope.changedValue = function (item,quan) 
    { 


     if (item != null && quan !=null) 
     { 

      $http.get('/api/product/'+ item).success(function (data) // this is the price for that product from the Database 
      { 
       //this sets amount field 
       $scope.amount = parseFloat(data.price * quan); 

      }); 

     } 
    } 

    // this generate a form 
    $scope.addNewChoice = function() 
    { 
     var newItemNo = $scope.choices.length + 1; 
     $scope.choices.push({ 'id': 'choice' + newItemNo }); 
    }; 

    // this remove the form 
    $scope.removeChoice = function() { 
     var lastItem = $scope.choices.length - 1; 
     if ($scope.choices.length > 1) { 
      $scope.choices.splice(lastItem); 
     } 
    }; 


}]); 

olduğunu !!

cevap

0

Seçimler dizisine 'miktar' koymalısınız. denetleyicisi Sonra

$scope.choices = [{ id: 'choice1', amount: 0}]; 

:

$scope.changedValue = function (choise,item,quan) 

choise.amount = parseFloat(data.price * quan); 

Ve tempalte içinde

:

ng-change="changedValue(choise,selected_id,quantity)"> 

<input type="text" class="form-control" id="amount" ng-model="choise.amount" ng-readonly="true" /> 
+0

Aslında bütün değer hakkını almak ve hesaplama da iyi ama konudur; Oluşturulan form, önceki bir 'dan farklı değildir, nasıl ayırt edebilirim ki, her bir form için hesaplanan tutar –

+0

Tam olarak dediğim gibi, her bir formun hesaplanan tutarını form ile birlikte $ scope.choices dizisinde tutmalısınız. İD. – staskus

İlgili konular