I used omines / datatables-bundle for my project in Symfony 6. I have a problem how to use a json file that is really large as a data source and pass it to datatables to properly display the data. How do I upload a file to datatable so that I can display the data from the json file? I know how to open a file, I can do it in a repository, for example, but I don't know any further json to datatable.
base.html.twig
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{% block title %}Welcome!{% endblock %}</title>
<!-- in the <head> section -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.2.1/dt-1.10.16/datatables.min.css"/>
{% block stylesheets %}
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
{% endblock %}
<!-- before the closing <body> tag -->
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.2.1/dt-1.10.16/datatables.min.js"></script>
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 128 128%22><text y=%221.2em%22 font-size=%2296%22>⚫️</text></svg>">
{# Run `composer require symfony/webpack-encore-bundle` to start using Symfony UX #}
{% block javascripts %}
{{ encore_entry_script_tags('app') }}
{% endblock %}
</head>
<body>
{% block body %}{% endblock %}
</body>
</html>
list.html.twig
{% extends "base.html.twig" %}
{% block body %}
<!-- Insert this where you want the table to appear -->
<div id="presidents">Loading...
<!-- Insert this at the end of your body element, but before the closing tag -->
<script src="{{ asset('bundles/datatables/js/datatables.js') }}"></script>
<script>
$(function() {
$('#presidents').initDataTables({{ datatable_settings(datatable) }}, { searching: true,});
});
</script>
</div>
{% endblock %}
DefaultController.php
<?php
namespace App\Controller;
use Symfony\Component\Routing\Annotation\Route;
use Omines\DataTablesBundle\Adapter\ArrayAdapter;
use Omines\DataTablesBundle\Column\TextColumn;
use Omines\DataTablesBundle\DataTableFactory;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Request;
class DefaultController extends AbstractController
{
/**
* @Route("/", name="index")
*
*/
public function index(Request $request, DataTableFactory $dataTableFactory)
{
$table = $dataTableFactory->create()
->add('firstName', TextColumn::class,['label' => 'customer.name', 'className' => 'bold'])
->add('lastName', TextColumn::class)
->createAdapter(ArrayAdapter::class, [
['firstName' => 'Donald', 'lastName' => 'Trump'],
['firstName' => 'Barack', 'lastName' => 'Obama'],
])
->handleRequest($request);
if ($table->isCallback()) {
return $table->getResponse();
}
return $this->render('list.html.twig', ['datatable' => $table]);
}
}