Javascript 使用angularjs提交symfony2表格_Javascript_Php_Forms_Angularjs_Symfony

Javascript 使用angularjs提交symfony2表格

javascript php forms angularjs symfony

Javascript 使用angularjs提交symfony2表格,javascript,php,forms,angularjs,symfony,Javascript,Php,Forms,Angularjs,Symfony,我正在用symfony2在后端构建一个应用程序。我正在考虑在前端使用AngularJS，但我仍然希望使用symfony表单。我已经用正确的模块和所有东西设置了表单，但是问题发生在实际提交数据时问题当Symfony呈现表单时，它将输入的“name”属性设置为数组，如user[username]，这是它希望在提交数据后接收数据的格式。我不知道如何才能以这种格式提交数据。这就是我所拥有的： <body ng-app="formApp" ng-controller="formControlle

我正在用symfony2在后端构建一个应用程序。我正在考虑在前端使用AngularJS，但我仍然希望使用symfony表单。我已经用正确的模块和所有东西设置了表单，但是问题发生在实际提交数据时

问题

当Symfony呈现表单时，它将输入的“name”属性设置为数组，如

user[username]

，这是它希望在提交数据后接收数据的格式。我不知道如何才能以这种格式提交数据。这就是我所拥有的：

<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>

当我提交时，名称-值对显然使用了

formData

变量，因此

username=testuser

而不是

user[username]=testuser

我试图设置formData变量，如

formData.user[username]

，但根本不起作用

那么，有没有一种方法可以在提交时使用输入“name”，或者采取某种措施以正确的格式提交表单？任何帮助都会很好

您可以在$scope函数中构建symfony期望的对象，您可以使用ng click将该对象绑定到表单的submit。因此：

<input type="submit" value="Save" /></div>

我使用服务器端代码来解决它。在处理请求和验证之前，我调用我创建的以下函数来更改格式：

   /**
     * 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;


     }

您可以使用{'data-ng-model'：'formData[“user[username]”]}。

要发布formData，您应该通过jQuery.param（）传递它。

我认为您应该保持角度表单逻辑。您应该使用

ng model

绑定数据。为此，您可以创建一个细枝表单主题，将

ng model

属性添加到输入中，请查看

然后可以将输入值传递给控制器中的$scope.data变量，如下所示：

$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);
    });
}

$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);
    });
}

谢谢你。我相信这会起作用，但是您知道是否有一种方法可以获得格式化的数组，而不必为每个表单元素手动定义它？如果没有办法，我只需要知道。事实证明，这是我能找到的最好的解决办法。我希望有一个更干净的方法，但我找不到任何方法。@akronymn这怎么行：var user=[]；用户['username']=$scope.formData.username用户
是一个数组
，您尝试将其与对象
@Sehael一起使用。如果您将formData用作所有表单字段的对象，则只需发布$scope.formData对象。这对嵌入表单有效吗？在我看来，这似乎只适用于简单的表单。使用应用程序/x-www-form-urlencoded的好信息，但是，如果您使用的是FOSRestBundle（建议使用，因为您要在前端和后端之间分离关注点），您可以在服务器端使用。
   /**
     * 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;


     }  

$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);
    });
}