AngularJS:使用相同的输入名称处理值

时间:2015-09-13 06:17:37

标签: javascript php mysql angularjs

我是AngularJS的新手,想要表单提交ajax。我需要一些关于如何传递具有相同输入名称的值(例如username [])的帮助或指导,以使用带有PHP / MYSQL的$ http.post作为JSON的后端辅助。

<!DOCTYPE html>
<html>
<head>
    <title>Testing</title>
</head>
<body ng-app="myApp">
<div ng-controller="tableController as tblCtrl">
    <table>
        <thead>
            <tr>
                <th>No</th>
                <th>Username</th>
                <th>Email</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="row in rows">
                <td>{{ $index + 1 }}</td>
                <td><input type="text" name="{{ row.iuname }}" placeholder="{{ row.iumask }}"></input></td>
                <td><input type="text" name="{{ row.iename }}" placeholder="{{ row.iemask }}"></input></td>
            </tr>
        </tbody>
    </table>
    <button ng-click="addRow()">Add Row</button>
    <button ng-click="addUsers()">Save</button>
</div>
<script src="angular.min.js"></script>
<script src="app.js"></script>
</body>
</html>

JS:

var app = angular.module('myApp', []);

app.controller('tableController', ['$scope', function($scope, $http) {
        $scope.rows = [{iumask:'Username',iuname:'username[]',iemask:'Email',iename:'uemail[]'}];

        $scope.addRow = function() {
            $scope.rows.push({iumask:'Username',iuname:'username[]',iemask:'Email',iename:'uemail[]'});
            $scope.iuname = '';
            $scope.iename = '';
        }

        $scope.iuname = "";
        $scope.addUsers = function(){

        }

    }]);

1 个答案:

答案 0 :(得分:0)

这样,您可以使用post requst将用户列表发送到服务器
            var inputContent=[];
            $scope.addValue=function(data){
                              inputContent.push(data);
                            }


            $scope.submit=function(){
                var promise=$http({
                        method : 'POST',
                        url : serviceUrl+"/userList",
                        data : $.param(inputContent), // pass in data as strings
                        headers : { 'Content-Type': 'application/x-www-form-urlencoded' }
                         // set the headers so angular passing info as form data (not request payload)
                    });
                promise.then(function(data){
                    alert(dat)
                })
            }