Javascript ne fonctionne pas pour les cases à cocher - php, javascript, jquery, checkbox, console

J'ai un ensemble de cases à cocher sur mon site qui fonctionnentle javascript posté ci-dessous. Le problème est que lorsque je choisis une couleur dans les cases à cocher, aucune action n'est effectuée et l'erreur suivante s'affiche dans la console Chrome:

GET ../store/indexMain.php?color=Khaki 500 (Internal Server Error) jquery-1.7.2.min.js:4
send jquery-1.7.2.min.js:4
f.extend.ajax jquery-1.7.2.min.js:4
f.fn.extend.load jquery-1.7.2.min.js:4
(anonymous function) www.tahara.es:68
f.event.dispatch jquery-1.7.2.min.js:3
h.handle.i

Voici le js:

<script type="text/javascript">
//http://jsbin.com/ujuse/1/edit
$(function() {
$("input[type="checkbox"]").on("change", function() {
var boxes = [];
// You could save a little time and space by doing this:
var name = this.name;
// critical change on next line
$("input[type="checkbox"][name=""+this.name+""]:checked").each(function() {
boxes.push(this.value);
});
if (boxes.length) {
$(".loadingItems").fadeIn(300);
// Change the name here as well
$(".indexMain").load("indexMain.php?"+this.name+"=" + boxes.join("+"),
function() {
$(".indexMain").fadeIn("slow");
$(".loadingItems").fadeOut(300);
});

} else {
$(".loadingItems").fadeIn(300);
$(".indexMain").load("indexMain.php", function() {
$(".indexMain").fadeIn("slow");
$(".loadingItems").fadeOut(300);
});
}
});
});

Ajout de PHP depuis indexMain.php

<?php
$colors = $_GET["color"];
if ($colors != "")
{
$colors = explode(" ", $colors);
$parameters = join(", ", array_fill(0, count($colors), "?"));
$items = $con -> prepare("SELECT * FROM item_descr WHERE color_base1 IN ({$parameters})");
$items ->execute($colors);
$count = $items -> rowCount();

}
else
{

$items = $con -> prepare("SELECT * FROM item_descr ORDER BY date DESC");
$items -> execute();
$count = $items -> rowCount();


}

$row_count = 0;
echo "<div>Showing ".$count."items</div>";
while($info = $items->fetch(PDO::FETCH_ASSOC))
{

?>

Merci!

Réponses:

Le problème ne réside pas dans le javascript, mais plutôt dans votre serveur.

$(".indexMain").load("indexMain.php?"+this.name+"=" + boxes.join("+"), function() {
$(".indexMain").fadeIn("slow");
$(".loadingItems").fadeOut(300);
});

Vous avez essayé de charger quelque chose à partir du serveur et le serveur a répondu 500. Consultez le journal de votre serveur et voyez quel est le problème.