2017-06-02 157 views
-1
var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope, $http) { 
    $scope.submitForm = function(cl) { 
    console.log(cl); 
    $http({ 
     method: 'POST', 
     url: "updated-profile", 
     data: { 
     cl: cl 
     }, 
    }).then(function successCallback(response) { 
     console.log("updated successfully"); 
     $scope.success = "Updated successfully"; 
    }, function errorCallback(response) { 
     console.log("not updated"); 
     $scope.error = "Unable to update"; 
    }); 
    } 
}); 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script> 
<div ng-app="myApp" ng-controller="myCtrl"> 
    <div ng-repeat="cl in clientList"> 
    <div id="error-messages" ng-show="error">{{error}}</div> 
    <div id="success" ng-show="success">{{success}}</div> 
    <div class="form-group"> 
     <div class="col-lg-4 col-md-4"> 
     <label for="fname">First Name</label> 
     </div> 
     <div class="col-lg-8 col-md-8 "> 
     <input type="text" class="form-control" placeholder="First Name" ng-model="cl.fname" /> 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-lg-4 col-md-4"> 
     <label for="lname">Last Name</label> 
     </div> 
     <div class="col-lg-8 col-md-8"> 
     <input type="text " class="form-control" ng-model="cl.lname" /> 
     </div> 
    </div> 
    </div> 
    <div class="form-group"> 
    <div class="col-lg-4 col-md-4"> 
     <label for="submit" class="sr-only">Update</label> 
    </div> 
    <div class="col-lg-8 col-md-8"> 
     <input type="button" class="form-control btn btn-success" id="update" ng-click="submitForm(cl)" name="Update" value="Update" /> 
    </div> 
    </div> 
</div> 

我使用上面的代码将数据发送到服务器。 我的服务器代码是角柱发送空值到服务器

public class Update extends ActionSupport { 

    private Client cl = new Client(); 
    private String fname; 
    public String update() { 
     System.out.println("testing this"); 
     System.out.println("client detail " + cl.getFname() + " " + 
          cl.getLname()); 
     System.out.println("fname"+getFname()); 
    } 
} 

我越来越

client detail null null 
fnamenull 

如果我使用data: {fname: cl.fname},然后还fnamenull。 我无法使用角度传递任何值来操作。 这里有什么问题? 这里做了哪些修改才能正确工作?

+0

angularjs已被弃用 –

+0

如何角JS是depricated? – xrcwrn

+0

您使用的angularjs版本已过时。 –

回答

0

你的按钮

<input type="button" class="form-control btn btn-success" id="update" ng-click="submitForm(cl)" name="Update" value="Update" /> 

有可能成为ng-repeat循环内,否则将无法访问该cl对象是本地的ng-repeat范围。

或者,如果您希望该按钮为“全局”,则可以提交ng-submit中的整个clientList,然后遍历控制器内的数组。这取决于你的流程以及你需要什么类型的UX/UI。

+0

是ng-repeat中的提交按钮 – xrcwrn

+0

您在原始代码中提交的代码没有“ng-repeat”中的按钮。请再次检查模板。 –

0
$http({ 
    method: 'POST', 
    url: "www.mylocalhost.com/api/updated-profile", 
    data: { 
    cl: cl 
    }, 
}); 

当您调用$ http服务“url”参数时,包含一个适当的api路径。只需使用有效的API网址即可。我希望它会起作用。

或者 改变 “CL”:$ scope.clientList