呈现一个完整的小枝模板，在Symfony中用ajax扩展另一个模板
呈现一个完整的小枝模板，在Symfony中用ajax扩展另一个模板
提问于 2015-04-20 13:53:07
我的主布局名为layout.html.twig。在这个布局中，我制作了扩展他的块内容，请参阅代码：
<!DOCTYPE html>
<html>
<!-- my html code, meta header, body ... etc -->
<body>
<div class="col-md-12 panel panel-default" id="content">
{% block content %}
{# extend content to the principal layout #}
{% endblock %}
</div>
</body>
</html>实际上，每次我喜欢在中加载另一个页面内容时，我都会像这样扩展布局，例如在indexEquipement.html.twig中
{% extends "MyBundleBundle::layout.html.twig" %}
{% block content %}
<div class="page-header">
<h4>add an equipement</h4>
</div
<select id="selectEquipement">
<option selected disabled>choose an equipement</option>
<option value="{{ path('addEquipement1') }}">Equipement 1</option>
<option value="{{ path('addEquipement2') }}">Equipement 2</option>
</select>
{% endblock %}这是索引的路由文件：
indexEquipements:
path: /manageEquipements
defaults: { _controller: MySpaceMyBundle:ManageEquipements:indexEquipements }
requirements:
methods: GET如您所见，在本例中，我有一个带有url的select标记，用于values选项。我尝试使用ajax呈现自己选择的视图，而不重新加载浏览器页面。
实际上，选项值的每个url都是一个具有不同形式的视图。我在select中选择了一个选项，ajax在同一页面中返回与我的选择相匹配的表单。
见我的设备1 addAction()控制器
/**
*
* @Route("/manageEquipement/addEquipement1", name="addEquipement1")
* @Method("get")
*/
public function addEquipements1Action() {
$eq = new Equipement1;
$form = $this->createForm(new Equipement1Type(), $eq);
$request = $this->getRequest();
if ($request->isMethod('POST') | ($form->isValid())) {
$form->bind($request);
$em->persist($eq);
$em->flush();
return $this->redirect($this->generateUrl('indexEquipements'));
} else {
return $this->render('MySpaceMyBundle:MyFolder:addEquipement1.html.twig', array('form' => $form->createView() ));
}
}现在是用于此操作的路由文件：
addEquipement1:
path: /manageEquipement/addEquipement1
defaults: { _controller: MySpaceMyBundle:ManageEquipements:addEquipement1 }
requirements:
methods: GET
addEquipement1_process:
path: /manageEquipement/addEquipement1/process
defaults: { _controller: MySpaceMyBundle:ManageEquipements:addEquipement1 }
requirements:
methods: POST如何在ajax中为addEquipement1Action()呈现表单？
##编辑
这是addEquipement1Action()的控制器操作：
/**
*
* @Route("/manageEquipement/addEquipement1", name="addEquipement1")
* @Method("get")
*/
public function addEquipement1Action() {
$request = $this->getRequest();
$eq = new Equipement1;
$form = $this->createForm(new Equipement1Type(), $eq);
if($request->isXmlHttpRequest()){
$template = $this->forward('MySpaceMyBundle:MyFolder:addEquipement1.html.twig', array('form' => $form->createView() ))->getContent();
$json = json_encode($template);
$response = new Response($json, 200);
$response->headers->set('Content-Type', 'application/json');
if ($request->isMethod('POST') | ($form->isValid())) {
$form->bind($request);
$em->persist($eq);
$em->flush();
return new Symfony\Component\HttpFoundation\RedirectResponse($this->generateUrl('indexEquipements'));
} else {
return $response;
}
}
}这是设备的索引：{%扩展"MyBundleBundle::layout.html.twig“%}
{% block content %}
<div class="page-header">
<h4>add an equipement</h4>
</div
<select id="selectEquipement">
<option selected disabled>choose an equipement</option>
<option value="{{ path('addEquipement1') }}">Equipement 1</option>
<option value="{{ path('addEquipement2') }}">Equipement 2</option>
</select>
<div id="formEquipement"></div>
<script type="text/javascript">
$('#selectEquipement').change(function(event) {
$.ajax({
type: "GET",
url: "{{ path('addEquipement1') }}",
dataType: "html",
success: function(data){
$("formEquipement").append(data);
}
});
});
</script>
{% endblock %}当我在select标记中应用选择时，我可以看到当我在浏览器中调试时ajax调用是否工作，但它会返回与我想要显示的视图有关的错误：
控制器必须返回响应(null给定)。您忘记在控制器的某个地方添加返回语句了吗？
这是我对addEquiment1.html.twig的小枝视图
<form action="{{ path('addEquipement1_process') }}" method="POST" {{ form_enctype(form) }}>
<div class="col-md-5">
<br>
<div>
{{ form_errors(form) }}
</div>
<br>
<div>
{{ form_widget(form) }}
</div>
<br>
<div>
{{ form_rest(form) }}
</div>
<br>
<div>
<input type="submit" value="Add" class="btn btn-small btn-success"/>
</div>
</div>
</form>在不使用Ajax刷新浏览器的情况下，如何在实际页面中正确地呈现此视图？
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-04-20 16:47:23
如何在ajax中为addEquipement1Action()呈现表单？
- 您可以将表单放在div容器中，并通过客户机中的JS解析它。
- 或者你把树枝分开。将表单
yourform.html.twig包含在indexEquipement.html.twig块中，并在控制器中添加一个if语句，如果设置了参数onlyForm，则呈现yourform.html.twigyourform.html.twigindexEquipement.html.twig。当然，您也可以使用不同的路由和控制操作来删除if语句，这样读起来可能会更好。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29749873
复制相关文章
相似问题
腾讯云开发者
