Javascript angularjs 序列化表单数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12141035/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
angularjs serialize form data
提问by z22
i wish to serialize the form data in angularjs. following is the controller code:
我希望在 angularjs 中序列化表单数据。以下是控制器代码：
function SearchCtrl($scope, $element, $http) {
$scope.url = 'php/search.php';
$scope.submit = function() {
var elem = angular.element($element);
//var dt = $(elem.parent()).serialize();
console.log($(elem.parent()).serialize());
$http({
method: 'POST',
url: $scope.url,
data: 'first=hgf&last=ghfgh',
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function(data, status) {
$scope.status = status;
$scope.data = data;
$scope.result = data; // Show result from server in our <pre></pre> element
//var elem = angular.element(e.srcElement);
//alert($(elem.parent()).serialize());
}).error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
});
return false;
};
}
edited:
编辑：
<!DOCTYPE html>
<html ng-app>
<head>
<title>Search form with AngualrJS</title>
<script src="../angular-1.0.1.min.js"></script>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="js/search.js"></script>
</head>
<body>
<div>
<form ng-controller="SearchCtrl" ng-submit="submit()">
<label>Search:</label>
<input type="text" ng-model="keywords" placeholder="enter name...">
<input type="text" ng-model="desc" placeholder="enter description...">
<button type="submit">Search</button>
<p>Try for example: "php" or "angularjs" or "asdfg"</p>
</form>
<pre ng-model="result">
{{result}}
</pre>
</div>
</body>
</html>
but nothing gets printed on the console. where am i going wrong?
但控制台上没有打印任何内容。我哪里错了？
回答by raina77ow
From the doc:
从文档：
For a form element's value to be included in the serialized string, the element must have a name attribute.
对于要包含在序列化字符串中的表单元素的值，该元素必须具有 name 属性。
In your HTML inputs do not have names, hence serializereturns an empty string. Fix this with something like...
在您的 HTML 输入中没有名称，因此serialize返回一个空字符串。用类似的东西解决这个问题...
<input type="text" name="keywords" ng-model="keywords" placeholder="enter name...">
<input type="text" name="desc" ng-model="desc" placeholder="enter description...">
And, btw, you don't have to wrap Angular $elementinto jQuery function: $element.serialize()would work ok.
而且，顺便说一句，您不必将 Angular 包装$element到 jQuery 函数中：$element.serialize()可以正常工作。
