Symfony 2 - Update database on click - php

Question

I try to update the 'archive' value of the database when I click on a check box. After searching the site and google, I managed to do it.
However, by adding a second article, it only works for the first one. If you ever have ideas, I will be grateful!
Thank you
I have fosjsroutingbundle installed.
Here is my controller :
public function archiveAction($id, Request $request)
{
if ($request->isXmlHttpRequest()) {
$em = $this->getDoctrine()->getManager();
$glasse = $em->getRepository('SosMontagesBundle:Glasse')->find($id);
$glasseArchiveStat = $glasse->getArchive();
if ($glasseArchiveStat == false) {
$glasse->setArchive(true);
$em->flush();
} else {
$glasse->setArchive(false);
$em->flush();
}
return new Response('d');
}
}
My route :
sos_montage_archive:
path: /admin/archive/{id}
defaults: { _controller: SosMontagesBundle:Admin:archive }
requirements:
id: \d+
options:
expose: true
My view :
{% extends '#SosMontages/layout.html.twig' %}
{% block content %}
<div class="col-md-6 col-md-offset-3">
<h2>Liste des lunettes</h2>
<table class="table table-striped">
<thead>
<tr>
<th>Id</th>
<th>Marque - Model</th>
<th>Description</th>
<th>Archive</th>
<th>Ordre</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{% for article in pagination %}
<tr {% if loop.index is odd %}class="color"{% endif %}>
<td>{{ article.id }}</td>
<td>{{ article.name ~ ' - ' ~ article.brand }}</td>
<td>{{ article.content }}</td>
{% if article.archive == false %}
<td><input type="checkbox" name="{{ article.id }}" id="archive"></td>
{% else %}
<td><input type="checkbox" name="{{ article.id }}" id="archive" checked></td>
{% endif %}
<td></td>
<td><i class="fa fa-pencil fa-2x" aria-hidden="true"></i>
<i class="fa fa-trash-o fa-2x" aria-hidden="true"></i></td>
</tr>
{% endfor %}
</tbody>
</table>
<div class="navigation">
{{ knp_pagination_render(pagination) }}
</div>
</div>
{% endblock %}
{% block javascript %}
<script src="{{ asset('bundles/fosjsrouting/js/router.js') }}"></script>
<script src="{{ path('fos_js_routing_js', { callback: 'fos.Router.setData' }) }}"></script>
<script>
$(document).ready(function () {
$("#archive").click(function () {
var id = $("#archive").attr('name');
var DATA = 'sentValue=' + id;
$.ajax({
type: "POST",
url: Routing.generate('sos_montage_archive', { id: id }),
data: DATA,
cache: false,
success: function (data) {
alert("database has been updated");
}
});
});
});
</script>
{% endblock %}

Answer 1

Your click listenner on your checkbox may not be correct. You should use a change listener while it's a checkbox. Change your click function in js to change:
$('#archive').change(function() {
if($(this).is(":checked")) {
//'checked' event code
return;
}
//'unchecked' event code
});
However you also have two checkboxes and only one id. This might create weird bugs. Changing your ids to #archive1 and #archive2 may fix your code.

Answer 2

You have to fix your HTML and differentiate your #archive id selector.
You can do that by using loop.index for example:
id="archive{{ loop.index }}" //output : archive1, archive2...
Twig doc :
http://twig.sensiolabs.org/doc/2.x/tags/for.html#the-loop-variable