Je suis débutant en JS, et je travaille sur un ancien code compliqué, en fait, j'essaie de remplacer une fonction appelé par "Select" qui permet de rajouter l'élément sélectionné dans un input texte caché qui se réinitialise à chaque fois.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
<select id="selectAptitudes" onchange="$('aptitudes_id').value=this.value; addAptitudeField(this,'aptitudes');">
 
<input name="aptitudes_id" id="aptitudes_id" type="hidden" value="">
Voici la fonction addAptitudeField:

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
62
63
64
65
66
67
68
69
70
71
72
73
74
addAptitudeField : function(currentAutocompleteField, idChamp) {
// permet le passage de parametres au setTimeout
    var currentAutocompleteFieldBind = currentAutocompleteField;
    var idChampBind = idChamp;
// le setTimeOut permet d'executer la fonction apres le vidage du
// champ par la premiere fonction onblur
// ne pas changer le timing de 400
    window.setTimeout(function() {
        var idChamp = idChampBind;
        var currentAutocompleteField = $(currentAutocompleteFieldBind);
        var currentValue = currentAutocompleteField.options[currentAutocompleteField.selectedIndex].title;
        var currentCategorie = currentAutocompleteField.options[currentAutocompleteField.selectedIndex].parentNode.label;
        var currentParent = currentAutocompleteField.parentNode;
        var allInputs = currentParent.getElementsByTagName("input");
        var countAllInputs = allInputs.length;
        var lastAutocompleteFieldId = allInputs[countAllInputs - 1];
        var lastValueId = "";
        if (lastAutocompleteFieldId != null) {
            lastValueId = lastAutocompleteFieldId.value;
        }
        // création du champ suivant
        if (currentValue != "" && (lastAutocompleteFieldId == null || lastValueId != "") && currentCategorie != "") {
                 var hiddenIdsField = $(idChamp);
        // On teste que l'aptitude n'est pas déjà ajoutée à la fiche
        var tabIds = hiddenIdsField.value.split(configuration.listSeparator);
        var found = false;
        for (var i = 0; i < tabIds.length && !found; i++) {
            found = tabIds[i] == lastValueId;
        }
        if (!found) {
            aptitudeAvecDetail.stockeTemporairementValeurs();
            var divCategorie = $("divCat" +currentCategorie);
            var nbAptitudesCat = 0;
            if (divCategorie) {
                nbAptitudesCat = divCategorie.getElementsByTagName('div').length;
            } else {
                // On crée la div de la catégorie si elle n'existe pas encore
                var divList = $("list" + idChamp);
                var newDivCategorie = "<div class=\"" +idChamp+"\" id=\"divCat" + currentCategorie + "\">";
                newDivCategorie = newDivCategorie + "<span class=\"champConsultationValeur categorieAptitude\" >" + currentCategorie + "</span>";
                newDivCategorie = newDivCategorie + "</div>";
                divList.update(divList.innerHTML + newDivCategorie);
                divCategorie = $("divCat" +currentCategorie);
            }
 
            var paramDwr = {};
            var newDivName = "div" + idChamp + lastValueId;
            paramDwr[attributs.r_divId] = newDivName;
            paramDwr[attributs.r_currentValue] = currentValue;
            paramDwr[attributs.r_hiddenIdsField] = hiddenIdsField.id;
            paramDwr[attributs.r_lastValueId] = lastValueId;
            paramDwr[attributs.r_itemmod] = nbAptitudesCat % 2 == 0;
 
            RepertoireDwr.ligneSuppEtSpanMessage(paramDwr, function(ajaxPage) {
 
            divCategorie.update(divCategorie.innerHTML + ajaxPage.texte);
 
            // on remets les valeurs qui auraient été settées
            aptitudeAvecDetail.remetsValeursStockees();
 
            if (hiddenIdsField.value != "") {
                hiddenIdsField.value = hiddenIdsField.value + configuration.listSeparator;
            }
            hiddenIdsField.value = hiddenIdsField.value + lastValueId;
        }
 
        if ( $('selectAptitudes')){
            $('selectAptitudes').options[0].selected = true;
        }
 
        $(idChamp + "_id").value = "";
    }
    }, 400);
},
C'est très compliqué, non? Ce que j’essaie de faire c'est de remplacer le select par un ensemble de checkbox qui vont permettre la selection multiple des éléments, et un bouton pour déclencher l’événement, mon événement ajouterAptitude est déclencher en cliquant sur un bouton

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
ajouterApt = function(){
    var listApt = [];
    $('.Aptitudes input:checked').each(function() {
        listApt.push(this.name);
    });
    nbrItem = listApt.length;
    for(var i=0; i<nbrItem; i++){
        $('aptitudes_id').value=listApt[i].value;
        addAptitudeField(listApt[i],'aptitudes');
    }
};
Il permet d'appeler la première fonction le nombre de fois que les cases cochées. Malheureusement ce code ne marche pas, et quand je clique sur le bouton la page se retélécharge et je ne sais pas comment ni pourquoi.

Avez vous des idées, des pistes pour résoudre ce problème.

Merci d'avance