AngularJS块以symfony2形式提交按钮
[英]AngularJS blocks submit button in symfony2 form
问题描述
I have form created in symfony2, which at the end renders button to submit form. 
我在symfony2中创建了表单，该表单最后显示了提交表单的按钮。 When I add ng-app="myApp" everything works fine, but I can't submit form which is on this page. 当我添加ng-app="myApp"一切正常，但是我无法提交此页面上的表单。 Why is that and how to unblock this? 为什么会这样以及如何取消阻止呢？
FORM: 形成：
->add('company','choice',array(
'mapped' => false,
'attr'=>array('ui-select2'=>'myArray', 'ng-model'=>'form.company','ng-options'=>'option.value as entity.name_company for entity in entities','ng-change' => 'changeItem()')
))
->add('project',null,array(
'attr'=>array('ui-select2'=>'myArray2', 'ng-model'=>'form.task','ng-options'=>'option.value as entity.description_task for entity in tasks')
))
VIEW: 视图：
<html ng-app="flowApp">
<head>
<link rel="stylesheet" href="{{ asset('external-libs/select2/select2.css')}}">
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="{{ asset('external-libs/select2/select2.js')}}"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.5/angular.min.js"></script>
<script src="{{ asset('external-libs/select2.js')}}"></script>
<script src="{{ asset('external-libs/app.js') }}"></script>
<style>
.select2-choice { width: 220px; }
</style>
</head>
<body>
<div class="container" ng-controller="MainCtrl">
{{ form(form) }}
</div>
</body>
</html>
SCRIPT: 脚本：
var app = angular.module('flowApp', ['ui.select2']).config(function($interpolateProvider){
$interpolateProvider.startSymbol('{[{').endSymbol('}]}');
}
);
app.controller('MainCtrl', function ($scope, $element,$http) {
$http({method: 'GET', url: 'companies.json'}).
success(function(data, status, headers, config) {
$scope.entities = data.entities;
$scope.form = {company: $scope.entities[0].value };
console.debug(data.entities);
});
});
2 个解决方案
解决方案1
2 2014-08-28 16:03:20
Well documentation says: 好的文档说：
For this reason, Angular prevents the default action (form submission to the server) unless the element has an action attribute specified
so you can add action attribute to your form. 因此您可以将动作属性添加到表单中。 In my example i am using grenerateUrl function, but you should generate url of your current route(route of controller where the form is generated) 在我的示例中，我正在使用grenerateUrl函数，但是您应该生成当前路径的网址（生成表单的控制器的路径）
$data = array();
$form = $this->createFormBuilder($data,
array("action" => $this->generateUrl("route_to_curent_path"))))
->add('field', 'text')
->add('submitButton', 'submit')
->getForm();
EDIT: just now found out that this is a duplicate question here and here and here and here (this link being the most upvoted answer) 编辑：刚刚发现这是一个重复的问题， 这里和这里 ， 这里和这里 （此链接是最受好评的答案）
解决方案2
0 2014-04-09 09:21:00
We need more informations, did you let browser validate form ? 我们需要更多信息，您是否让浏览器验证表单？ To remove : 去除 ：
{{ form(form, {
'attr': {
novalidate,
},
})
}}
Maybe errors popup are hidden (happen with various complexe form fields) 可能隐藏了错误弹出窗口（出现了各种复杂表单字段）
When you said "i can't submit", is the submit button unable ? 当您说“我无法提交”时，“提交”按钮是否无法启动？ Errors happen after sumbission ? 提拔后会发生错误？
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.