Bonjour,

J'ai ce code qui fonctionne sur tous les navigateurs à part IE8, je ne sais pas comment résoudre le problème.
Le fait c'est que le bouton supprimer est toujours grisé même si je check les cases, sauf si je clique sur selectionner tout là le bouton supprimer devient activé.
Avez-vous une solution? Merci d'avance.

JS:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function suppressionMultiple() {
    var nbrChecked = function() {
        var aptitudesASupprimer = jQuery('#Aptitudes :checked').length;
        var aptitudesPresentes = jQuery('#Aptitudes input:checkbox').length;
        if (aptitudesASupprimer == 0)
            jQuery('#supprimer').removeAttr('href').removeClass("actifBtn").addClass("desactifBtn");
        else
            jQuery('#supprimer').attr('href','#').removeClass("desactifBtn").addClass("actifBtn");
    };
 
    nbrChecked();
    jQuery( "#desactifBtn input[type=checkbox]" ).on( "change", nbrChecked);
};
 
function selectionner() {
    jQuery('#Aptitudes input[type=checkbox]').prop('checked', true );
    jQuery('#supprimer').attr('href', '#').removeClass("desactifBtn").addClass("actifBtn");
};
CSS:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
#selectionner {
    float: left;
}
 
#supprimer {
    float: right;
}
 
.categorieAptitudes label {
    display: block;
    padding-left: 2px;
}
 
#SupAptitudes {
    margin-top: 0px;
    margin-bottom: 5px;
    padding-bottom: 10px;
}
 
a.actifBtn {
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    border: solid thin #929292;
    text-shadow: none;
    background: #F6F6F6;
    background-image: -webkit-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: -moz-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: -ms-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: -o-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: linear-gradient(to bottom, #F6F6F6, #DDDDDD);
    color: buttontext;
    text-decoration: none;
    padding: 3px 8px;
 
}
 
a.actifBtn:hover {
    background-image: -webkit-linear-gradient(top, #DDDDDD, #F6F6F6);
    background-image: -moz-linear-gradient(top, #DDDDDD, #F6F6F6);
    background-image: -ms-linear-gradient(top, #DDDDDD, #F6F6F6);
    background-image: -o-linear-gradient(top, #DDDDDD, #F6F6F6, #DDDDDD);
    background-image: linear-gradient(to bottom, #DDDDDD, #F6F6F6);
}
 
a.desactifBtn {
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    border: solid thin #929292;
    text-shadow: none;
    background: #F6F6F6;
    background-image: -webkit-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: -moz-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: -ms-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: -o-linear-gradient(top, #F6F6F6, #DDDDDD);
    background-image: linear-gradient(to bottom, #F6F6F6, #DDDDDD);
    color: grey;
    text-decoration: none;
    padding: 3px 8px;
}
HTML:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<div id="Aptitudes" onchange="suppressionMultiple();">
  <div class="group">
    <div class="nomCategorie"> Réinsertion - suivi</div>
    <div class="categorieAptitudes" id="Réinsertion - suivi">
      <label>
      <input type="checkbox" value="1251"><span class="item-search">Appartement pour mise en situation d'autonomie</span>
      </label>
      <label>
      <input type="checkbox" value="1282"><span class="item-search">Education du patient et de son entourage à domicile</span>
      </label>
      <label>
      <input type="checkbox" value="1293"><span class="item-search">Equipe mobile, suivi à domicile</span>
      </label>
    </div>
  </div>
</div>
 
<div id="SupAptitudes">
    <a class="actifBtn" id="selectionner" onclick="selectionner();">Séléctionner tout</a>
    <a class="desactifBtn" id="supprimer">Supprimer</a>
</div>