使用angularjs提交symfony2表單
[英]submit a symfony2 form using angularjs
問題描述
我正在后端使用symfony2構建應用程序。 我正在考慮在前端使用AngularJS，但我仍想使用symfony形式。 我已經使用正確的模塊和所有內容設置了表單，但是實際提交數據時會出現問題。
問題
當Symfony呈現表單時，它會將輸入的“名稱”屬性設置為一個數組，例如user[username] ，這是它期望在提交數據后會接收數據的格式。 我不知道如何使Angular以這種格式提交數據。 這就是我所擁有的：
<body ng-app="formApp" ng-controller="formController">
{{ form_start(form, {'attr':{'id': 'registerForm', 'ng-submit':'processForm()'}}) }}
{{ form_row(form.username, {'attr':{'ng-model':'formData.username'}}) }}
{{ form_row(form.password.first, {'attr':{'ng-model':'formData.password'}}) }}
{{ form_row(form.password.second) }}
{% for address in form.userAddresses %}
{{ form_row(address.postalCode, {'attr':{'ng-model':'formData.postalCode'}}) }}
{% endfor %}
<div><input type="submit" value="Save" /></div>
{{ form_end(form) }}
</body>
和控制器：
function formController($scope, $http) {
$scope.formData = {};
$scope.processForm = function() {
$http({
method : 'POST',
url : submit,
data : $.param($scope.formData),
headers : { 'Content-Type': 'application/x-www-form-urlencoded' }
})
.success(function(data) {
alert(data.message);
});
};
}
當我提交時，顯然，名稱/值對使用formData變量，因此username=testuser而不是user[username]=testuser 。
我試圖設置像formData.user[username]這樣的formData變量，但這根本不起作用。
那么，有沒有一種方法可以在提交時使用輸入的“名稱”，或者采取某種措施使表單以正確的格式提交？ 任何幫助將是巨大的！
4 個解決方案
解決方案1
2 已采納 2014-01-18 05:36:08
您可以在$ scope函數中構建symfony期望的對象，該函數將使用ng-click綁定到表單的提交。 所以：
<input type="submit" value="Save" /></div>
會成為
<input type="submit" value="Save" ng-click="submitForm()" /></div>
在您的控制器中，您可以在$ scope對象上添加一個函數
$scope.submitForm = function() {
var user = [];
user['username'] = $scope.formData.username;
//etc
};
解決方案2
2 2014-07-16 09:19:05
我認為您應該保持Angular表單邏輯。 您應該使用ng-model綁定數據。 為此，您可以創建一個Twig表單主題，以將ng-model屬性添加到您的輸入中，請看一下要點 。
然后可以將輸入值傳遞給控制器中的$ scope.data var，如下所示：
$scope.var = {};
您應該使用本文第 109行提供的功能序列化數據，或者如果使用jQuery，則使用jQuery.param（）。
然后創建一個提交方法，如下所示：
$scope.submit = function(){
$http.post(
'http://www.myurl.com',
this.serializeData($scope.data),
{ headers: {
'Content-Type': 'application/x-www-form-urlencoded' //Fix for Symfony
}
})
.success(function(data) {
//
})
.error(function (data){
$log.error(data);
});
}
解決方案3
0 2014-01-18 10:07:25
我使用服務器端代碼解決它。 在處理請求和驗證之前，我調用了我創建的以下函數來更改格式：
/**
* Format the request content with the form name
* @param Request $request
* @param $formName
* @param null $content
* @return Request
*/
public function formatRequestWithForm(Request $request, $formName, $content = null)
{
if ($content === null) {
$content = $request->getContent();
}
$contentArray = array($formName => json_decode($content, true));
$request->attributes->add($contentArray);
$request->request->add($contentArray);
return $request;
}
解決方案4
0 2014-02-10 23:55:01
您可以使用{'data-ng-model'：'formData [“ user [username]”]'}。 要發布formData，您應該通過jQuery.param（）傳遞它。
AngularJS塊以symfony2形式提交按鈕
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.