如何在Symfony2中正确使用AJAX

时间:2017-01-24 13:57:38

标签: javascript php jquery ajax symfony

我正在尝试使用AJAX在单击按钮后运行我的控制器代码。从我收集的内容来看,这就是你应该使用AJAX ...它会从前端向后端发送响应,然后生成json响应。

但是我无法弄清楚如何正确地做到这一点。我不确定如何让AJAX成功运行控制器代码。

我所能做的就是在成功时显示表格,但我不希望控制器代码在单击按钮之前运行,因为这是AJAX的要点。

Symfony似乎没有关于此的文档:http://symfony.com/legacy/doc/book/1_0/en/11-Ajax-Integration

这些堆栈溢出问题/答案对我来说太旧了或者没有帮助我:

How to integrate Ajax with Symfony2

How to make a POST Ajax request with Symfony and Jquery

树枝:

<button id="begin-check" type="button">Run Test</button>

<table class="stab">
  <thead>
    <tr>
      <th style="text-align: center">Ang</th>
      <th style="text-align: center">Lat</th>
    </tr>
    <tr>
        <th>Name &amp; Age</th>
        <th>Name &amp; Age</th>
    </tr>
  </thead>
  <tbody>
  {% for person in persons %}
        <tr>
            <td>
                <a href="{{ path('users_edit', { 'id': person[0] }) }}">
                    {{ person[1] }}, {{ person[2] }} 
                </a>
            </td>
            <td>
            {% if person[7] == 'Moe' %}
                <a href="{{ path('edit', { 'id': person[6] }) }}">
            {% else %}
                <a href="{{ path('low_edit', { 'id': person[8] }) }}">
            {% endif %}
                    {{ person[4] }}, {{ person[5] }} 
                </a>
            </td>
        </tr>
    {% endfor %}
  </tbody>
</table>

AJAX:

<script type="text/javascript">
    $(document).ready(function(){
        $(document).on('click', "#begin-check", function(e){
            console.log('You have clicked');
            e.preventDefault();
            $.ajax({
                method: 'POST',
                url: "{{ path('control_check') }}",
                data: { //research what to put here
                 },
                success: function(responseData){
                    //run the controller code
                    //Show HTML table
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    console.log(xhr.status);
                    console.log(xhr.responseText);
                    console.log(thrownError);
                },
            })
        });
    });

</script>

在控制器中:

/**
 *
 * @Route("/control", name="control_check")
 * @Template()
 */
public function controlCheckAction()
{
    $request = $this->get('request');
    $em = $this->getDoctrine()->getManager();

    $persons = array();

    //more code

    return new JsonResponse(array('persons' => $persons));

}

2 个答案:

答案 0 :(得分:0)

我认为您需要添加的内容是offsetWidth方法。 Here是官方文件。

所以:

$("#result").html(
"<br />JQUERY says: " + $("#divA").width() + 
"<br />JAVASCRIPT says: " + document.getElementById("divA").offsetWidth;
);

答案 1 :(得分:0)

可能我遇到了同样的情况。

在我的情况下,我忘了添加“使用”声明。 你不忘记添加这一行吗?

use Symfony\Component\HttpFoundation\JsonResponse;

我附上了我的检查点。

【1】检查服务器端应用程序日志

error_log("create json response OK" . "\n", 3, "/usr/local/var/log/php/error.log");
return new JsonResponse(array('persons' => $persons));

【2】检查控制台调试器

open chrome debugger(F12) - &gt;网络标签 - &gt; “/ control”(左侧导航)

因此,您可以确认“响应标题”。

[OK] Content-Type:application/json
[NG] Content-Type:text/html

如果你找到“text / html”,我认为是服务器端问题。

【3】检查symfony2调试器

您可以在同一个标​​签中找到symfony2调试器网址【2】

X-Debug-Token-Link:http://xxxxxxxxx/_profiler/xxxxx

您应该打开此分析器链接。 如果这个问题来自服务器端,你可以发现任何问题。