mainDisplay.html.twig 1.92 KB
Newer Older
Mat's avatar
Mat committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
{% extends "@Techno/layout.html.twig" %}

{% block body %}
    <table id="table-owners">
        <thead>
            <tr>
                <th>Nom</th>
                <th>Prénom</th>
                <th>Date</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
16 17 18 19 20 21 22 23 24 25 26
{% endblock %}

{% block customJS %}
<script type="text/javascript">

    let ownersURL = '{{ path('api_owner_read') }}';
    let table = document.querySelector("table#table-owners");
    let tbody = table.querySelector("tbody");

    console.log(ownersURL);
    console.log(table);
Mat's avatar
Mat committed
27

Mat's avatar
Mat committed
28 29 30 31 32
    function reloadTableOwner()
    {
        let xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function() {
            console.log(this);
Mat's avatar
Mat committed
33 34
            if (this.readyState === 4
                && (this.status === 200 || this.status === 0)) {
35

Mat's avatar
Mat committed
36
                let json = JSON.parse(this.responseText);
37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54

                for (let i = 0; i < json.length; i++)
                {
                    let tr = document.createElement('tr');
                    let td1 = document.createElement('td');
                    td1.textContent = json[i].firstname;
                    tr.appendChild(td1);
                    let td2 = document.createElement('td');
                    td2.textContent = json[i].lastname;
                    tr.appendChild(td2);
                    let td3 = document.createElement('td');
                    td3.textContent = json[i].created_at;
                    tr.appendChild(td3);
                    let td4 = document.createElement('td');
                    td4.textContent = json[i].modify_at;
                    tr.appendChild(td4);
                }

Mat's avatar
Mat committed
55 56
                console.log(json);
            }
Mat's avatar
Mat committed
57 58 59 60 61 62
        };
        xhr.open('GET', ownersURL, true); // les données GET sont dans ownersURL
        xhr.send(null); // les données POST seraient ici
    }
    reloadTableOwner();

63
</script>
Mat's avatar
Mat committed
64
{% endblock %}