Php Symfony-Ajax选择

我在一个Symfony项目中工作，我有一个产品实体，我需要一个Ajax搜索栏来搜索我的产品并选择其中的一些。问题是，我有一个搜索栏，它提供了数据库的实时结果，但如果我选择了产品，它应该会在我的表中显示数据。由于某些原因，我无法在表中显示选定的结果

js

控制器

public function viewActionSearch(Request $request)
{

$query = $request->get('term');

$result = [
    'results' => [],
];

if ($query !== null){
    $products = $this->productRepository->getSearchList($query);

    $result['results'];

    foreach ($products as $product) {
        $result['results'][]     = [
            'id' => $product['id'],
            'text' => $product['name'],
        ];
    }

} else {

    $products = $this->productRepository->getResultList(1);
    foreach ($products as $entity) {
        $result['results'][] = [
            'id' => $entity['id'],
            'text' => $entity['name'],
        ];
    }
}

return new JsonResponse($result);

}

产品列表

public function getPage(Request $request)
    {
        $products = $this->productRepository->getAllProducts($currentPage);

        return $this->render(
            '@app_bar/Product/productList.twig',
            [
                'products' => $products,                   
            ]
        );
    }

小枝

---

如果我访问route/product/api/search/它将返回我的a结果，但我无法在我的表中显示这些选定的产品。

您在这里遗漏了一些内容。Symfony不像vue.js或类似的前端框架那样工作。您所做的是呈现服务器端请求，之后，您只需通过AJAX获取数据，而对该数据不做任何处理。jQuery需要关于如何处理从服务器获取的数据的说明。您始终可以在某些前端框架旁边使用Symfony，但您需要了解服务器端渲染您的细枝模板和前端框架渲染它时的区别

提示： $'.js数据示例ajax'。选择2{ 阿贾克斯：{ url:“/product/api/search”， 数据类型：“json”， 成功：函数数据{ $.eachresponse，函数{ $'mytable'。追加+this.product_name++this.product_price+； }; } } };

---

有不同的呈现方法，可以重新加载整个表，也可以只重新加载所需的行。

但您不需要在表中显示数据。@u\u mulder添加了表，但该表的结果不是从搜索API中获得的ProductList:：getPage如何适应这里？这是另一个控制器操作吗？同样值得注意的是，可以使用服务器端呈现的HTML响应AJAX请求，然后将其插入DOM；e、 g:$.get'some/html'，response=>$'.result'.htmlresponse，但在本例中，您不会使用JsonResponse@DarraghEnright我想用select2 ajax调用中的select产品替换表中的所有结果，但我现在不知道如何用一个结果替换结果。您可以帮助我如何处理数据吗？您必须呈现一个在收到服务器的响应后返回表。我将编辑我的答案。使用jQuery选择表，然后根据从服务器获得的数据呈现该表。哪个部分不清楚？有一个包含所有结果的表，该表从控制器获取结果。还有一个ajax搜索栏，这些结果是json格式的，我可以在其中搜索。但一旦我选择了一个产品，我就无法将其呈现给symfony控制器。我不明白你的意思，你用jquery选择表并根据从服务器获得的数据呈现该表。你收到要在浏览器上显示的JSON产品列表吗？这是正确的吗？

public function getPage(Request $request)
    {
        $products = $this->productRepository->getAllProducts($currentPage);

        return $this->render(
            '@app_bar/Product/productList.twig',
            [
                'products' => $products,                   
            ]
        );
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<!-- select2 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/gh/ttskch/select2-bootstrap4-theme@master/dist/select2-bootstrap4.min.css" rel="stylesheet">


<div class="container mt-5">
    <form>
        <div class="form-group">
            <select class="js-data-example-ajax form-control"></select>
            </select>
        </div>
    </form>
</div>




<table class="table table-hover table-responsive">
    <thead>
    <tr>
        <th>id</th>
        <th>Title</th>
        <th>SKU</th>
        <th>Actions</th>
    </tr>
    </thead>
    <tbody>
    {% for product in products %}
        <tr>
            <td>
                {{ product.id }}
            </td>
            <td>
                {{ product.name }}
            </td>
            <td>
                {{ product.sku }}
            </td>
            <td>
                <a href="{{ path('app_product_getproduct', {'id': product.id}) }}" class="btn btn-success btn-sm" >
                    <span class="glyphicon glyphicon-pencil"></span>
                </a>
                <a href="{{ path('app_product_delete', {'id': product.id}) }}" class="btn btn-danger btn-sm" onclick="return confirm('Are you sure?')">
                    <span class="glyphicon glyphicon-trash"></span>
                </a>

            </td>
        </tr>
    {% endfor %}
    </tbody>
</table>