如何在表格网格中的多行中绑定基于数据的下拉列表选择

时间:2016-10-03 07:00:22

标签: angularjs asp.net-mvc-4

我有一个带有一个客户下拉列表的表格,两个输入值和+ buton来添加新行

能够在下拉列表更改时将数据绑定到输入, 如果我选择madhu,madhu数据绑定。 然后我添加行, 然后如果我正确选择bhanu数据绑定但前一行madhu数据变空, 再次我添加行并选择madhu,数据绑定到所有madhu选定的下拉行,并保持空

$scope.rvm = [{}];
    $scope.GetAccountBalance = function (c) {

        //getting pending data from database based on customer 
        var getPendingData = ReceiptsService.GetPendings(c);
        getPendingData.then(function (d) {
            var Testdata = d.data;

            $scope.GetEmployeeDetail = function (c) {
              var result = $.grep(Testdata, function (e) { return e.Party == c; });
                $scope.testRvm = result;
                return $scope.testRvm[0];

                };
        });
        //adding row on plus click      
        $scope.addRow = function (index,c) {

            if ($scope.rvm.length == (index + 1)) {
                $scope.rvm.push( {

                });


            }
        }

视图

<table id="myTable">
    <tr>
        <th>Customer</th>
        <th>Pendings</th>
        <th>Pending Value</th>

    </tr>
    <tr ng-repeat="r in rvm" @*ng-init="$index"*@ @*ng- ng-class-odd="'odd'" ng-class-even="'even'"*@>
        <td>
            <select ng-model="c" ng-change="GetAccountBalance(c)" ng-options="c.ID as c.Name for c in customer track by c.ID" style="width:150px;height:22px;" name="tCustomer" required>
                <option value="">select Customer</option>
            </select>

        </td>

        <td>
            <input type="text" ng-value="0.00" ng-model="GetEmployeeDetail(c).Pendings" class="input-large" name="tPendings" readonly />
        </td>
        <td>
            <input type="text" ng-value="0.00" ng-model="GetEmployeeDetail(c).PendingsAdjusted" ng-model-onblur ng-change="GetTotalAmount()" class="input-large" name="tPendingsAdjusted" />
        </td>

        <td ng-if="$last">
            <a href="#">
                <span class="glyphicon glyphicon-plus orange" ng-click="addRow($index,c)"></span>
            </a>
        </td>
    </tr>
</table>

0 个答案:

没有答案