Partage
  • Partager sur Facebook
  • Partager sur Twitter

Cours Apprenez à coder avec JavaScript

    24 janvier 2019 à 11:36:27

    Bonjour,
    J'ai une petite question par rapport aux événements : avec l'évent "click" seul mon clic gauche est détecté, pourtant avec "mouseup" et "mousedown" le clic droit et le clic molette sont bien détecté.
    voici mon code au cas ou(c'est quasiment le meme que celui du cour)
    edit : par détecté je veut dire que l'évent ne se déclenche pas (j'imagine) vu qu'aucune information ne s'affiche dans la console

    function getBoutonSouris(code){
        let bouton = "inconnu";
        switch(code){
            case 0:
                bouton = "gauche";
                break;
            case 1:
                bouton = "roulette";
                break;
            case 2:
                bouton = "droit";
                break;
        }
        return bouton;
    }
    function infoClic(e){
        console.log("event : "+e.type+". Clic "+getBoutonSouris(e.button)+" a la position X : "+e.clientX+", Y : "+e.clientY+".");
    }
    document.addEventListener("click", infoClic);
    document.addEventListener("mouseup", infoClic);
    document.addEventListener("mousedown", infoClic);
    Merci d'avance

    -
    Edité par julien chemin 24 janvier 2019 à 11:39:24

    • Partager sur Facebook
    • Partager sur Twitter
      27 janvier 2019 à 15:36:28

      Bonjour,

      ce n'est pas le même évènement pour le click droit : https://developer.mozilla.org/fr/docs/Web/Events/contextmenu

      • Partager sur Facebook
      • Partager sur Twitter
        28 janvier 2019 à 10:03:48

        Bonjour, pour le dernier exercice fonctionne très bien avec Mozilla Firefox par contre je rencontre un problème avec google chrome et Internet explorer c'est que les popups bloquent l'affichage dans la console donc soit je travail avec les popups soit avec la console or je dois travailler avec les deux. Merci
        • Partager sur Facebook
        • Partager sur Twitter
          28 janvier 2019 à 12:12:45

          Merci pour ta réponse Piero5673,

          je ne cherche pas a interagir avec le menu du clic droit mais seulement a le détecter. J'était sur le cours "programmation évènementiel" du javascript quand j'ai écrit ce post, et l'un des exercice consiste a utiliser l'event click pour afficher dans la console "clic gauche", "roulette" ou "clic droit". Mon code fonctionne avec l'event mouseup et mousedown mais pas avec l'event click, pourtant dans le cour c'est bien l'event click qui est utilisé et sa a bien l'air de fonctionner. j'imagine que le cour a besoin d'être mis a jour?
          (pourtant sur developer.moz dans l'event click la propriété button indique qu'elle doit renvoyer 0 pour le clic gauche, 1 pour la molette si il y en a une et 2 pour le clic droit)

          AmaniChahdoura, peut tu préciser de quel exercice tu parle? et je ne comprend pas en quoi les popup empêche l'affichage dans la console.
          • Partager sur Facebook
          • Partager sur Twitter
            28 janvier 2019 à 12:54:23

            @julien skiz il me semble que click c'est uniquement pour le bouton gauche, ensuite tu as le contextmenu uniquement pour le bouton droit, et les mousedown et mouseup pour tous les boutons.
            • Partager sur Facebook
            • Partager sur Twitter
              31 janvier 2019 à 9:59:44

              Bonjour,

              je suis actuellement le cours sur javascript et j'aurai voulu connaitre la différence entre :

              e.target.value

              form.elements.name.value

              merci de votre aide

              • Partager sur Facebook
              • Partager sur Twitter
                31 janvier 2019 à 10:26:17

                Bonjour,

                e.target.value te donne la valeur de l'élément sur lequel on a déclenché l'évènement. Par exemple, si j'ai un champ (input) qui a pour id firstname, et que je souhaite afficher dans la console la valeur de ce champ à chaque fois que je la modifie, je peux faire :

                document.getElementById('firstname').addEventListener('change', function(e) {
                  console.log(e.target.value);
                });

                Dans le 2ème cas, en partant du principe que form représente ton formulaire, il possède la propriété elements qui contient tous les champs de ton formulaire. Si tu as un champ qui a pour name password, et que tu veux récupérer sa valeur, tu peux faire: 

                const form = document.querySelector('form');
                console.log(form.elements.password.value);

                • Partager sur Facebook
                • Partager sur Twitter
                  31 janvier 2019 à 10:51:31

                  Merci pour l'explication, ce n'est pas encore limpide mais c'est déjà plus clair!:)
                  • Partager sur Facebook
                  • Partager sur Twitter
                    1 février 2019 à 8:04:55

                    bonjour à tous ! Je viens vous demandez de l'aide car j'ai récupéré un java script mais je  suis pas capable de changer les image des cartes qui bouges j'ai juste été capable de changer la carte de fond et la je sais plus quoi faire et ou aller la dedans. svp aider moi 

                    Voici le code en question :


                    <!doctype html>

                    <html lang="fr">

                    <head>

                    <title>Le tirage gratuit de don&voyance : trois cartes</title>

                    <meta name="description" content="Le tirage gratuit de don&voyance trois cartes, une interprétation personnalisée des 22 lames majeures, profitez des conseils divinatoires du tarot de marseille pour réaliser vos projets"/>

                    <script src="http://www.mahasiadonvoyance.com/pages/informations/personnel/code-jquery-com.html"></script>

                    <script src="http://www.mahasiadonvoyance.com/pages/informations/personnel/images-cartes.html"></script>

                    <script>

                    var changePage;

                    var fold;

                    var unfold;

                    var animateRotate;

                    /*----------------------------------------

                    Les cartes en mouvement ici et description

                    ------------------------------------------*/

                    var cardsTitle = ['L\'amoureux', 'L\'ermite', 'Le monde', 'L\'empereur', 'La force', 'Le bateleur', 'Le pape', 'Le mat', 'La maison dieu', 'L\'imp&eacute;ratrice', 'La roue de la fortune', 'Le soleil', 'Le chariot', 'La justice', 'Le pendu', 'L\'arcane sans nom', 'La temp&eacute;rance', 'Le diable', 'L\'&eacute;toile', 'La lune', 'Le jugement', 'La papesse'];

                    /*------------------------------------------

                    --------image carte de tarot---------------

                    -------------------------------------------*/

                    var cardsImage = ['amoureux.jpg', 'ermite.jpg', 'monde.jpg', 'empereur.jpg', 'force.jpg', 'bateleur.jpg', 'pape.jpg', 'fou.jpg', 'maisondieu.jpg', 'imperatrice.jpg', 'rouefortune.jpg', 'soleil.jpg', 'chariot.jpg', 'justice.jpg', 'pendu.jpg', 'mort.jpg', 'temperance.jpg', 'diable.jpg', 'etoile.jpg', 'lune.jpg', 'jugement.jpg', 'papesse.jpg'];

                        /*-------------------------------------------

                        --------signification carte------------------

                        --------------------------------------------*/

                    var cardsSigni = ['Le choix - le doute', 'La voie &agrave; prendre', 'R&eacute;ussite et r&eacute;alisation', 'Pouvoir et loi', 'Volont&eacute; et &eacute;nergie', 'Le commencement', 'Spiritualit&eacute; et sagesse', 'Voyage et initiation', 'Deception et bouleversement', 'Pouvoir intuitif', 'Richesse et prosp&eacute;rit&eacute;', 'Equilibre', 'Triomphe succ&egrave;s', 'Loyaut&eacute; et ordre', 'Renoncement et sacrifice', 'Changement', 'Patience et mod&eacute;ration', 'Tentation et exc&egrave;s', 'Evolution et conseils sages', 'Emotivit&eacute; et gestation', 'Recompense des efforts', 'La connaissance'];

                        /*--------------------------------------------

                        --------La description des cartes-------------

                        ----------------------------------------------*/

                    var cardsDescr = ['Prenez garde aux tentations, aux imprudences et aux prises de d&eacute;cisions impulsives, cela pourrait s\'av&eacute;rer dangereux pour votre &eacute;quilibre de vie.hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh', 


                    'Vous serez en qu&ecirc;te d\'esp&eacute;rance et de valeurs humaines essentielles, une d&eacute;ception peut vous entrainer dans une certaine m&eacute;lancolie, ne vous laissez pas abattre!hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh',


                    'Le monde vous apporte une une &eacute;volution heureuse &agrave; court terme! vous triompherez des obstacles qui se dressaient sur votre route.', 


                    'Vous souhaitez vous r&eacute;aliser mat&eacute;riellement, il est temps pour vous de passer &agrave; l\'action tout en gardant les pieds sur terre.',


                    'Vous poss&eacute;dez une bonne vitalit&eacute; et vous avez de l\'&eacute;nergie &agrave; revendre, vous esp&eacute;rez que ces valeurs soient reconnues par votre entourage. Vos efforts seront r&eacute;compens&eacute;s.', 


                    'Tous les atouts sont de votre c&ocirc;t&eacute;, vous pouvez b&eacute;n&eacute;ficier de bonnes opportunit&eacute;s et le moment est venu d\'entreprendre et d\'agir, ne c&eacute;dez pas &agrave; l\'immobilisme!',


                    'N\'attachez pas trop d\'importance aux valeurs mat&eacute;rielles, cherchez plut&ocirc;t &agrave; d&eacute;velopper votre intuition, elle vous servira dans un futur proche.hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh', 


                    'Vous &ecirc;tes fatigu&eacute; d\'attendre quelque chose qui tarde &agrave; arriver, essayez de vous changer les id&eacute;es. Vous aurez tendance &agrave; vous laisser aller.', 


                    'Des risques de conflits ou de s&eacute;paration sont &agrave; craindre, attention aux pertes financi&egrave;res dues &agrave; une mauvaise gestion.', 


                    'M&eacute;fiez vous des ennuis que pourraient vous causer certains proches, vos meilleurs atouts sont la communication et le respect de la loi.', 


                    'L\'annonce d\'un changement d&ucirc; au hasard ou &agrave; la destin&eacute;e vous est r&eacute;serv&eacute; dans un court avenir, soyez pr&ecirc;t &agrave; recevoir cette transformation rapide.', 


                    'les choses cach&eacute;es ou en gestation vous invitent &agrave; la r&eacute;flexion. Sur le plan sentimental, une modification est &agrave; pr&eacute;voir dans un avenir proche et la fin d\'une attente.', 


                    'Vous saurez triompher de vos &eacute;preuves, cet arcane vous annonce la concr&eacute;tisation d\'un souhait qui vous tenait &agrave; coeur depuis bien longtemps.hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh', 


                    'Vous allez b&eacute;n&eacute;ficier d\'un appui solide dans vos d&eacute;marches, si vous avez des soucis pour d&eacute;m&eacute;ler une situation difficile, un d&eacute;nouement heureux se produira.', 


                    'Vous ressentez le besoin de vous lib&eacute;rer d\'une situation qui vous p&egrave;se et qui ne vous convient plus, vous cherchez le d&eacute;tachement et la libert&eacute; d\'action', 


                    'Vous allez vivre une p&eacute;riode de transformation et de changement, le moment est propice pour faire table rase du pass&eacute;.', 


                    'Vous aurez &agrave; faire preuve de patience et de calme int&eacute;rieur, vous ne reglerez pas vos affaires en agissant de mani&egrave;re impulsive, contr&ocirc;lez vos &eacute;motions!', 


                    'Votre app&eacute;tit pour les plaisirs de la vie est grand et vous avez envie de les croquer &agrave; pleines dents, attention aux exc&egrave;s de toutes sortes.', 


                    'Les travaux intellectuels et les recherches vous &eacute;panouiront, ils favoriseront un nouveau d&eacute;part, acceptez toutes les propositions qui vous seront faites, en ce sens.', 


                    'Votre sensibilit&eacute; et votre imagination sont mises en avant, vous ressentez un profond d&eacute;sir de vous laisser aller au gr&eacute; de vos envies. La cr&eacute;ation est favoris&eacute;e.', 


                    'Vous b&eacute;n&eacute;ficierez d\'un grand pouvoir de d&eacute;cision aupr&egrave;s des gens qui vous entourent, profitez en pour r&eacute;aliser les choses qui vous tiennent &agrave; coeur.', 


                    'les choses cach&eacute;es ou en gestation vous invitent &agrave; la r&eacute;flexion. Sur le plan sentimental, une modification est &agrave; pr&eacute;voir dans un avenir proche et la fin d\'une attente.'];


                    $(function() {

                    /*----------------------------------

                    ----------- PAGE CHANGE ------------

                    ------------------------------------*/

                    $("*[data-page]").hide();

                    $("*[data-current-page='true']").show();

                    changePage = function(content, pageNum) {

                    $("."+content+"[data-current-page='true']").hide();

                    $("."+content+"[data-page='"+pageNum+"']").show().attr("data-current-page", "true");

                    }


                    /*----------------------------------

                    --------- ROTATION ANIMATE ---------

                    ------------------------------------*/

                    animateRotate = function(el, time, it, from, to) {

                    var span = parseFloat(to) - parseFloat(from);

                    var step = 25/time;

                    var newValue = from + (span * $.easing.easeInCubic(step * parseInt(it), it*25, 0, 1, time));

                    $(el).css("-o-transform", "rotate("+newValue+"deg)");

                    $(el).css("-moz-transform", "rotate("+newValue+"deg)");

                    $(el).css("-webkit-transform", "rotate("+newValue+"deg)");

                    $(el).css("-ms-transform", "rotate("+newValue+"deg)");

                    if(it*25 < time)

                    setTimeout("animateRotate('"+el+"', "+time+", "+(parseInt(it)+1)+", "+from+", "+to+")", 25);

                    }

                    /*----------------------------------

                    ------------- FOLDING --------------

                    ------------------------------------*/

                    //additionnal easing effect

                    $.easing.easeInCubic = function (x, t, b, c, d) {

                    return c*(t/=d)*t*t + b;

                    };

                    //for redian to degree conversion

                    var rad2deg = 57.2957795;

                    var cardLimit = 22;

                    var mid = (cardLimit-1)/2

                    //current selected card, and their position

                    var current = 0;

                    var pos = [ [-105, 110] , [0, 110] , [105, 110] , [0, 95, 120, 213]];

                    var choseCard = [];

                    //number of created card

                    fold = function() {

                    var i = 0;

                    var moving = false;

                    function chooseCard(card, last) {

                    //if we're at the last card, do nothing

                    if((current == pos.length-1 || moving) && !last)

                    return;

                    //just in case it's the last card automatically showed

                    carte = $(this);

                    if($(card).hasClass("carte"))

                    carte = $(card);

                    if(carte.attr("data-selected") == "true")

                    return;

                    //prevent two cards to be fold at the same time

                    moving = true;

                    //calculate positions and get widths for later

                    var cardWidth = 80;//carte.width();

                    var cardHeight = 142;//carte.height();

                    var pHeight = carte.parent().height();

                    var curPos = pos[current++];

                    var curLeft = curPos[0] - cardWidth/2;

                    var curTop = pHeight - curPos[1] - cardHeight;

                    var finPos = pos[pos.length-1];

                    var finLeft = finPos[0] - finPos[2]/2;

                    var finTop = pHeight - finPos[1] - 3*cardHeight/2;

                    //keeps the good ol' card

                    var oldImage = $("img", carte);

                    //prevents a card from appearing two or more times

                    var okay = false;

                    while(!okay) {

                    card = Math.floor(Math.random()*cardsImage.length);

                    okay = true;

                    for(var k = 0; k < choseCard.length; k++)

                    if(choseCard[k] == card)

                    okay = false;

                    }

                    choseCard.push(card);

                    //creates and adds the card to the DOM

                    var newCard = $("<img />").attr("src", "cartes/"+cardsImage[card]);

                    carte.prepend(newCard);

                    //custom rotation because jquery sucks

                    animateRotate("*[data-number="+carte.attr("data-number")+"]", 300, 0, carte.attr("data-angle"), 0);

                    //scales the card. We have to scale both image and div because Chrome doesn't support inherit correctly

                    $("img", carte).animate({

                    width: finPos[2],

                    height: finPos[3]

                    }, "slow");

                    carte.attr('data-selected', true).css({ zIndex: current }).animate({

                    left: [finLeft, "easeInCubic"],

                    bottom: finTop,

                    width: finPos[2],

                    height: finPos[3]

                    }, "slow", null, function() {

                    carte.addClass("cardSel"+current);

                    if(!last) {

                    //shows card and resize it after some time

                    oldImage.fadeOut('');

                    eval("setTimeout(function() { $('.cardSel"+current+" img').animate({ width: '80px', height: '142px' }, 'fast'); $('.cardSel"+current+"').animate({ left: "+curLeft+"+'px', bottom: "+curTop+"+'px', width: '80px', height: '142px' }, 'fast', null, function() { if(current < pos.length - 1) moving = false; }); }, 650);");

                    }

                    else {

                    //if it's the last, redesigns the interface...

                    moveInterface();


                    }

                    //if it's the last, chooses a random card

                    if(current >= pos.length - 1 && !last) {

                    setTimeout(function() {

                    moveInterface();

                    }, 850);

                    }

                    });

                    }

                    function moveInterface() {

                    $(".carte[data-selected='true']").fadeOut("slow");

                    //retrieves the last image

                    var lastImage = choseCard[0];

                    $("#confirmLast").fadeIn().empty().css({

                    font: "13px verdana",

                    overflow: "auto"

                    }).html(cardsDescr[lastImage]);

                    //adds the big image

                    choseCard.push(lastImage);

                    var bigImage = $("<img />").attr("id","bigImage").attr("src", "cartes/" +cardsImage[lastImage]).css({ 

                    position: "absolute",

                    left: "-218px", 

                    top: "80px",

                    width: "140px",

                    height: "245px"

                    });

                    $("#container").append(bigImage);

                    $("#moreDatas").fadeIn().append("<h2>"+cardsTitle[lastImage]+"</h2>").append("<p>"+cardsSigni[lastImage]+"</p>");

                    //adds a start again button

                    var button = $("<div />").addClass("button").html("Refaire un tirage").click(function() {

                    window.location.reload();

                    }).css({

                    left: "-63px"

                    });

                    $("#container").append(button);

                    var button2;

                    var button2_1;

                    var button3;

                    var button4;

                    //adds a the switch view button

                    var button2 = $("<div />").addClass("button").html("Voir les cartes").click(function() {

                    $("#bigImage, #moreDatas, #confirmLast").fadeOut();

                    $(".carte[data-selected='true']").fadeIn();

                    button2_1.fadeIn();

                    button2.fadeOut();

                    button3.fadeOut();

                    button4.fadeOut();

                    }).css({

                    position: "absolute",

                    left: "53px"

                    });

                    $("#container").append(button2);

                    button2_1 = $("<div />").addClass("button").html("Voir les r&#233;sultats").click(function() {

                    $("#bigImage, #moreDatas, #confirmLast").fadeIn();

                    $(".carte[data-selected='true']").fadeOut();

                    button2_1.fadeOut();

                    button2.fadeIn();

                    button3.fadeIn();

                    button4.fadeIn();

                    }).css({

                    position: "absolute",

                    left: "53px"

                    }).hide();

                    $("#container").append(button2_1);

                    //adds a previous card button

                    var curCard = 0;

                    button3 = $("<div />").addClass("button").html("Carte pr&#233;c&#233;dente").click(function() {

                    curCard--;

                    if(curCard < 0)curCard = choseCard.length-2;

                    image = choseCard[curCard];

                    $("#bigImage").attr("src", "cartes/"+cardsImage[image]);

                    $("#moreDatas h2").html(cardsTitle[image]);

                    $("#moreDatas p").html(cardsSigni[image]);

                    $("#confirmLast").html(cardsDescr[image]);


                    }).css({

                    left: "-178px"

                    });

                    $("#container").append(button3);

                    //adds a next card button

                    button4 = $("<div />").addClass("button").html("Carte suivante").click(function() {

                    curCard++;

                    if(curCard >= choseCard.length-1)curCard = 0;

                    image = choseCard[curCard];

                    $("#bigImage").attr("src", "cartes/"+cardsImage[image]);

                    $("#moreDatas h2").html(cardsTitle[image]);

                    $("#moreDatas p").html(cardsSigni[image]);

                    $("#confirmLast").html(cardsDescr[image]);

                    }).css({

                    left: "170px"

                    });

                    $("#container").append(button4);

                    //hides unused cards

                    $(".carte[data-selected!='true'], .refold").fadeOut("slow");

                    }

                    function foldSub() {

                    //defines top and left position of the new card

                    var a = (i-mid)/rad2deg - Math.PI/2;

                    var left = Math.cos(a)*20000/cardLimit;

                    var bottom = Math.sin(i/(cardLimit-1)*Math.PI)*55 + Math.abs((i-mid));


                    //randomizes position a bit, to looks more natural

                    diffL = Math.random()*6-3;

                    diffT = Math.random()*6-3;

                    //checks if the card already exists

                    if(!$(".carte[data-number="+i+"]").length) {

                    //creates the card's div and gives it its class

                    var carte = $("<div></div>").attr("data-number", i).addClass("carte");

                    var img = $("<img />").attr("src", "http://www.mahasiadonvoyance.com/medias/images/dessus-carte-tarot5.jpg"); /* ICI C'EST L'IMAGE DU DESSUS DES CARTES DE TAROT A LA LIGNE 321 */

                    carte.append(img);

                    //adds the card to the DOM

                    $("#container").append(carte);

                    //we want rotation from -10 to +10 before randomizing

                    var a = (i-mid)

                    //rotates the card (maybe not working on IE8-)

                    var angle = (i-mid)*Math.abs(i-mid)/3 + (Math.random()*10-5);

                    carte.css("-o-transform", "rotate("+angle+"deg)");

                    carte.css("-moz-transform", "rotate("+angle+"deg)");

                    carte.css("-webkit-transform", "rotate("+angle+"deg)");

                    carte.css("-ms-transform", "rotate("+angle+"deg)");

                    carte.attr("data-angle", angle);


                    //over effect ...

                    carte.mouseover(function() {

                    if($(this).attr("data-selected"))

                    return;

                    l = (parseInt($(this).attr("data-number"))-mid) * 2;

                    t = cardHeight/3 + parseInt($(this).attr("data-number"))-mid;

                    $(this).animate({ 

                    left: "+="+l, 

                    bottom: "+="+t

                    }, "fast");

                    });

                    //...and the out !

                    carte.mouseout(function() {

                    if($(this).attr("data-selected"))

                    return;

                    l = (parseInt($(this).attr("data-number"))-mid) * 2;

                    t = cardHeight/3 + parseInt($(this).attr("data-number"))-mid;

                    $(this).animate({ 

                    left: "-="+l, 

                    bottom: "-="+t

                    }, "fast");

                    });

                    //moves the card to the current position

                    carte.click(chooseCard);

                    }

                    else {

                    //just selects it

                    carte = $(".carte[data-number="+i+"]");

                    while(carte.attr("data-selected") == "true")

                    carte = $(".carte[data-number="+(++i)+"]");

                    }

                    //sets card's position, and animates it

                    var cardWidth = $(carte).width();

                    var cardHeight = $(carte).height();

                    carte.css({

                    bottom: "-200px"

                    }).animate({ 

                    left: (left + diffL - cardWidth/2)+"px", 

                    bottom: (bottom + diffT)+"px" 

                    }, "fast");

                    //creates a new card if needed

                    i++;

                    if(i < cardLimit)

                    setTimeout(function() { foldSub() }, 50);

                    }

                    foldSub();

                    }

                    unfold = function(callback) {

                    var i = 0;

                    function unfoldSub(callback) {

                    while($(".carte[data-number="+i+"]").attr("data-selected") == "true") {

                    i++;

                    }


                    $(".carte[data-number="+i+"]").animate({

                    left: 0,

                    bottom: "-200px"

                    }, "fast");

                    //hide a new card if needed

                    i++;

                    if(i < cardLimit)

                    setTimeout(function() { unfoldSub(callback) }, 50);

                    else

                    callback();

                    }

                    unfoldSub(callback);

                    }

                    });

                    </script>

                    <style>

                    body {

                    margin: 0;

                    padding: 0;

                    }

                    .page {

                    box-sizing: border-box;

                    -moz-box-sizing: border-box;

                    -webkit-box-sizinf: border-box;

                    position: relative;

                    width: 470px;

                    height: 460px;

                    overflow: hidden;

                    margin: 0 auto;

                    padding: 0 20px;

                    font: 13px Arial;

                    color: #00f;

                    background: url("http://www.mahasiadonvoyance.com/medias/images/image-fond-pour-jeux-tarot.jpg");

                    }

                    .default {

                        <iframe src="http://www.mahasiadonvoyance.com/medias/images/image-fond-pour-jeux-tarot.jpg" width="470" height="460" frameborder="0" marginheight="0" marginwidth="0" scrolling="no"></iframe>

                    background: url("fond.jpg");

                    }


                    .button {

                    width: 100px;

                    text-align: center;

                    display: block;

                    padding: 4px 2px;

                    border-radius: 4px;

                    background: rgba(255, 255, 255, 0.90);

                    color: #000;

                    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);

                    cursor: pointer;

                    position: absolute;

                    bottom: 15px;

                    left: 50%;

                    margin-left: -50px;

                    }

                    .description {

                    box-sizing: border-box;

                    -moz-box-sizing: border-box;

                    -webkit-box-sizinf: border-box;

                    position: absolute;

                    top: 120px;

                    left: 50%;

                    background: rgba(255, 255, 255, 0.90);

                    width: 410px;

                    margin-left: -205px;

                    padding: 10px;

                    box-shadow: 0 0 5px rgba(0, 0, 0, 0.90);

                    border-radius: 8px;

                    }

                    #confirmLast {

                    box-sizing: border-box;

                    -moz-box-sizing: border-box;

                    -webkit-box-sizinf: border-box;

                    display: none;

                    cursor: pointer;

                    position: absolute;

                    left: -75px;

                    bottom: 135px;

                    z-index: 10;

                    background: rgba(255, 255, 255, 0.90);

                    padding: 10px;

                    width: 290px;

                    height: 100px;

                    font-size: 13px;

                    font-family: Verdana;

                    text-align: justify;

                    color: #000;

                    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);

                    border-radius: 8px;

                    }

                    #confirmLast.finishBloc {

                    font: 14px verdana;

                    overflow: auto;

                    }

                    #moreDatas {

                    overflow: auto;

                    box-sizing: border-box;

                    -moz-box-sizing: border-box;

                    -webkit-box-sizinf: border-box;

                    display: none;

                    cursor: pointer;

                    position: absolute;

                    left: -75px;

                    top: 80px;

                    z-index: 10;

                    background: rgba(255, 255, 255, 0.90);

                    border-radius: 8px;

                    padding: 10px;

                    width: 290px;

                    height: 100px;

                    font-size: 13px;

                    font-family: Verdana;

                    text-align: center;

                    }

                    #moreDatas h2 {

                    margin: 5px 0 10px 0;

                    font-size: 24px;

                    font-family: Verdana;

                    font-style:bold;

                    text-align: center;

                    color: #993366;


                    }


                    #container {

                    height: 100%;

                    position: absolute;

                    left: 50%;

                    }

                    .carte {

                    position: absolute; 

                    width: 50px; 

                    height: 92px; 

                    border-radius: 4px; 

                    cursor: pointer;

                    overflow: hidden;

                    }

                    .carte img {

                    position: absolute;

                    top: 0;

                    left: 0;

                    width: 50px; 

                    height: 92px; 

                    cursor: pointer;

                    }

                    </style>

                    <!--[if IE]>

                    <style>

                    #confirmLast, .description, .button {

                    background: rgb(255, 255, 255);

                    }

                    #moreDatas * {

                    color: rgb(255, 255, 255);

                    }

                    </style>

                    <![endif]-->

                    </head>

                    <body>

                    <div class="page default" data-page="1" data-current-page="true">

                      <a class="button" onclick="changePage('page', 2); fold();">Continuer</a>

                    </div>

                     <div class="page" data-page="2" data-current-page="false">

                     <p class="description">

                    Prenez le bon chemin et évitez les embuches en faisant, dès maintenant, le tirage du tarot de Marseille. Les 22 lames majeures vous révèleront vos obstacles, vos atouts pour réussir votre désir ainsi que votre état d'esprit du moment. <br/>Le tirage gratuit du tarot de Marseille trois cartes s'est adapté à vos besoins pour vous apporter une interprétation rapide, simple et personnalisée des 22 lames majeures, profitez des conseils divinatoires du tarot de marseille pour réaliser vos projets.

                      </p>

                     <a class="button" onclick="changePage('page', 3); fold();">Continuer</a>

                    </div>


                     <div class="page" data-page="3" data-current-page="false">

                     <div id="container">

                     <div id="confirmLast">Cliquez ici pour afficher la derni&#232;re carte</div>

                     <div class="page2" id="moreDatas"></div>

                     </div>

                     <a class="button refold" onclick="unfold(function() { setTimeout('fold()', 300) });">Rem&#233;langer</a>

                    </div>


                    </body>

                    </html>

                    • Partager sur Facebook
                    • Partager sur Twitter
                      1 février 2019 à 8:47:09

                      Salut,

                      personne ne te répondra si tu ne formatte pas ton code avec la balise code, afin que ça soit lisible.

                      En tout cas il y a plusieurs problèmes, premièrement il y a des balises script qui pointent sur du html, et deuxièmement jquery n'est pas importé donc ça ne risque pas de fonctionner.

                      Sinon pour les images, je suppose qu'il suffit de changer le fichier de l'image, ou alors de changer son nom en haut dans l'array.

                      -
                      Edité par lk77 1 février 2019 à 9:03:05

                      • Partager sur Facebook
                      • Partager sur Twitter
                        1 février 2019 à 10:05:28

                        Bonjour,

                        Merci d'utiliser la mise en forme de code Image

                        Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton Image de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue. Si vous utilisez l'éditeur de messages en mode Markdown, il faut utiliser les balises <pre class="brush: jscript;">Votre code ici</pre>.

                        • Partager sur Facebook
                        • Partager sur Twitter
                        Seul on va plus vite, ensemble on va plus loin ... A maîtriser : Conception BDD, MySQL, PHP/MySQL
                          4 février 2019 à 10:22:43

                          Bonjour, je viens de "terminer" le cour apprenez à coder en javascript, très bon cour mais je m'étonne de la dernière partie concernant cet exercice

                          Je trouve cet exercice hors sujet par rapport au cour que je viens de suivre. Je ne doute pas qu'il soit d'un niveau très basique dans l’apprentissage du js mais il aborde des choses qui ne sont absolument pas présentes dans le cour ni même abordé brièvement. A la sortie de ce cour je ne suis pas sensé savoir comment faire interagir du js avec du html pour afficher des choses etc..

                          Alors j'ai du mal à comprendre la pertinence de sa présence à la fin.
                          S'agit il d'une erreur ou je n'ai pas compris quelque chose concernant le fonctionnement des cours openclassrooms ?

                          -
                          Edité par altilou 4 février 2019 à 10:26:23

                          • Partager sur Facebook
                          • Partager sur Twitter
                            4 février 2019 à 17:23:55

                            Je ne voie pas se qui te pause problème, dans l'exercice que tu nous montre il n'y a pas d'interaction js/html, tu doit tout afficher dans la console.
                            Tu a regardé la vidéo qui explique le résultat attendu?
                            • Partager sur Facebook
                            • Partager sur Twitter
                              5 février 2019 à 0:22:05

                              Aaah.. ben non j'avais pas vue la vidéo.. je me suis pris la tête pour rien j'ai vraiment crus qu'il était demandé d'afficher tout ça sur la page html avec un bouton "ajouter un contact" etc.. >_<

                              C'est beaucoup plus clair forcément maintenant que j'ai vue la vidéo.. merci à toi :D

                              • Partager sur Facebook
                              • Partager sur Twitter
                                9 février 2019 à 15:55:13

                                Bonjour à tous, j'ai une grosse galère avec cette activité 2... Je renseigne mon formulaire, auteur, lien et titre et lorsque je clique sur Ajouter, la Div se créée bien en haut de mon contenu on l’aperçoit rapidement puis elle disparaît !! Je tourne en bourrique, j'ai tout effacé puis recommencé mais même problème je ne vois pas ou est mon erreur et rien en console...

                                var listeLiens = [
                                    {
                                        titre: "So Foot",
                                        url: "http://sofoot.com",
                                        auteur: "yann.usaille"
                                    },
                                    {
                                        titre: "Guide d'autodéfense numérique",
                                        url: "http://guide.boum.org",
                                        auteur: "paulochon"
                                    },
                                    {
                                        titre: "L'encyclopédie en ligne Wikipedia",
                                        url: "http://Wikipedia.org",
                                        auteur: "annie.zette"
                                    },
                                    
                                ];
                                
                                // TODO : compléter ce fichier pour ajouter les liens à la page web
                                
                                function ajoutLien(lien) {
                                    let titreLien = document.createElement("h3");
                                    titreLien.textContent = lien.titre;
                                    titreLien.href = lien.url;
                                    titreLien.style.display = "inline";
                                
                                    let urlhref = document.createElement("a");
                                    urlhref.href = lien.url;
                                    urlhref.style.textDecoration = "none";
                                    // urlhref.style.display = "inline"
                                
                                    let lientexte = document.createElement("p");
                                    lientexte.textContent = lien.url;
                                    lientexte.style.display = "inline";
                                    lientexte.style.marginLeft = "10px"
                                
                                    let nomAuteur = document.createElement("span");
                                    nomAuteur.textContent = "Ajouté par " + lien.auteur;
                                    nomAuteur.style.display = "block";
                                    nomAuteur.style.marginTop = "10px"
                                
                                
                                    let divLien = document.createElement("div");
                                    divLien.setAttribute("class", "divLien");
                                    divLien.style.backgroundColor = "white";
                                    divLien.style.margin = "20px";
                                    divLien.style.padding = "10px";
                                
                                
                                    urlhref.appendChild(titreLien);
                                    divLien.appendChild(urlhref);
                                    divLien.appendChild(lientexte);
                                    divLien.appendChild(nomAuteur);
                                    return divLien;
                                
                                }
                                
                                
                                // recuperation de chaque objet de la ListeLiens
                                let contenu = document.getElementById("contenu");
                                
                                listeLiens.forEach(function(lien) {
                                    let creerAjoutLien = ajoutLien(lien);
                                    contenu.appendChild(creerAjoutLien)
                                })
                                
                                // creation d'une div pour le formulaire
                                let divForm = document.createElement("div");
                                divForm.id = "divForm";
                                document.body.insertBefore(divForm, contenu);
                                
                                // creation bouton Ajouter un lien:
                                let boutonAjouter = document.createElement("button");
                                boutonAjouter.textContent = "Ajouter un lien";
                                boutonAjouter.style.marginLeft = "20px";
                                
                                
                                // divForm.appendChild(boutonAjouter);
                                document.getElementById("divForm").appendChild(boutonAjouter)
                                
                                
                                
                                // Event sur le bouton ajouter qui va creer le formulaire
                                boutonAjouter.addEventListener("click", function(e) {
                                    boutonAjouter.style.display = "none";
                                    let form = document.createElement("form");
                                
                                    // Creation des champs input et submit
                                    let inputAuteur = document.createElement("input");
                                    inputAuteur.setAttribute("type", "text");
                                    inputAuteur.setAttribute("name", "auteur");
                                
                                    inputAuteur.id = "auteurId";
                                    inputAuteur.placeholder = "Entrez votre nom";
                                
                                    let inputTitre = document.createElement("input");
                                    inputTitre.setAttribute("type", "text");
                                    inputTitre.setAttribute("name", "titre");
                                    inputTitre.id = "titreId";
                                    inputTitre.placeholder = "Entrez le titre";
                                
                                    let inputLien = document.createElement("input");
                                    inputLien.setAttribute("type", "url");
                                    inputLien.setAttribute("name", "url");
                                    inputLien.id = "urlId";
                                    inputLien.placeholder = "Entrez l'url du site";
                                
                                    let inputSubmit = document.createElement("input")
                                    inputSubmit.setAttribute("type", "submit")
                                    inputSubmit.id = "inputSubmit";
                                    inputSubmit.value = "Ajouter"
                                
                                    // insertion des éléments dans le formulaire
                                    form.appendChild(inputAuteur);
                                    form.appendChild(inputTitre);
                                    form.appendChild(inputLien);
                                    form.appendChild(inputSubmit);
                                
                                    // divForm.appendChild(form);
                                    document.getElementById("divForm").appendChild(form);
                                
                                    form.addEventListener("submit", function() {
                                        let objetListeLiens = Object.create(listeLiens);
                                        objetListeLiens.titre = form.elements.titre.value;
                                        objetListeLiens.url = form.elements.url.value;
                                        objetListeLiens.auteur = form.elements.auteur.value;
                                        let envoiAjoutLien = ajoutLien(objetListeLiens);
                                
                                        let divLien = document.getElementsByClassName("divLien");
                                        for( let i = 0; i < divLien.length; i++) {
                                            document.getElementById("contenu").insertBefore(envoiAjoutLien, divLien[0]);
                                        }
                                
                                        form.style.display = "none";
                                        boutonAjouter.style.display = "inline";
                                
                                    })
                                })
                                <!doctype html>
                                <html>
                                
                                <head>
                                    <meta charset="utf-8">
                                    <link rel="stylesheet" href="../css/liensweb.css">
                                    <title>Activité 2</title>
                                </head>
                                
                                <body>
                                    <h1>Activité 2</h1>
                                    
                                    <!-- Les nouveaux éléments sont ajoutés dans cette balise -->
                                    <div id="contenu">
                                    </div>
                                
                                    <script src="../js/liensweb.js"></script>
                                </body>
                                
                                </html>

                                -
                                Edité par GuillaumedeStéfano 9 février 2019 à 16:01:17

                                • Partager sur Facebook
                                • Partager sur Twitter
                                  10 février 2019 à 12:52:55

                                  Il faut que tu utilises e.preventDefault() dans ton listener pour annuler l'action par defaut.
                                  • Partager sur Facebook
                                  • Partager sur Twitter
                                  Passer pour un idiot aux yeux d'un imbécile est une volupté de fin gourmet.
                                    10 février 2019 à 16:01:59

                                    Merci Zoki, mais meme problème...ca apparait....et ca disparait !
                                    • Partager sur Facebook
                                    • Partager sur Twitter
                                      13 février 2019 à 15:31:21

                                      Salut Guillaume,

                                      Ta div disparaît parce que le formulaire est soumis (via ton bouton "submit") et donc la page se recharge.

                                      Si tu veux exécuter du code sans recharger la page, il faut utiliser une autre façon de faire.

                                      Tu peux voir 3 façons différentes de faire sur cette page : https://www.codexpedia.com/javascript/submitting-html-form-without-reload-the-page/.

                                      Dis moi si tu ne parles pas Anglais je peux t'aider.

                                      Tiens nous au courant :).

                                      • Partager sur Facebook
                                      • Partager sur Twitter

                                      Formateur JavaScript – Créateur de la formation vidéo en ligne JavaScript de Zéro.

                                        13 février 2019 à 23:40:12

                                        Merci Jérémy mais Zoki avait raison. C'etait le e.preventDefault() qui ne fonctionnait pas car je n'avais pas passé le paramètre(e) sur mon EventListener.
                                        • Partager sur Facebook
                                        • Partager sur Twitter
                                          16 février 2019 à 2:18:31

                                          Bonjour,

                                          Je ne suis pas encore passé pour une andouille aujourd'hui donc je ne vais pas passer à côté d'une occasion comme ça :

                                          Jusque ici, je suivais plus ou moins et, d'une façon ou d'une autre, j'arrivais à faire les exercices, faire marcher ce que je faisait ou au moins comprendre ce qui faisait que ça ne marchait pas.

                                          Mais là, je suis sur l'exercice du chapitre des chaines, je ne comprends pas ce qui ne marche pas et ça m'enerve :

                                          Je pense que ca doit être un truc évident, que je n'ai du coup pas compris, et m'agace ;)

                                          (La solution donne une technique toute differente, mieux sans doute, mais je voulais comprendre ce qui n'allait pas dans mmon truc avant .. ;))

                                          en vous remerciant,

                                          • Partager sur Facebook
                                          • Partager sur Twitter
                                            16 février 2019 à 2:31:29

                                            Bonjour,

                                            il y a un bouton </>, c'est plus pratique pour afficher le code.

                                            Tu ne prends pas en compte les majuscules. Pour tester les chaines de caractère, tu peux utiliser les regex : https://fr.wikipedia.org/wiki/Expression_r%C3%A9guli%C3%A8re https://regex101.com/ (pour tester)

                                            • Partager sur Facebook
                                            • Partager sur Twitter
                                              18 février 2019 à 9:25:29

                                              Bonjour @RaphaelSedack,

                                              Ta première erreur est l'emplacement de ton instruction return qui se trouve dans ton while et qui met donc fin à l'exécution de ta fonction dès la première itération de ta boucle.

                                              Pour te le prouver, ajoute un console.log(chaine[i]) avant ton if, et tu verras qu'il n'affichera que la première lettre de ton mot en console. Il ne passe donc qu'une seule fois dans ta boucle (à cause du return).

                                              Ajoute ensuite des parenthèses pour ta condition :

                                              if (chaine[i] === ("a" || "e" || "i" || ...)) {
                                              
                                              }

                                              Ton code devrait maintenant marcher pour les minuscules. Pour compter les majuscules, soit tu les ajoutes dans ta condition (à la suite de tes OU logiques ||), soit tu utilises la méthode toLowerCase() pour passer ta chaîne de caractères en minuscules.



                                              • Partager sur Facebook
                                              • Partager sur Twitter
                                                18 février 2019 à 21:17:28

                                                Bonjour, j'ai récemment fini ce cours et rendu l'exercice final dont voilà mes résultats.

                                                Apparemment les deux premiers correcteurs n'ont pas compris que l'exercice se résumait à afficher les informations dans la console et qu'il n'y avait pas besoin de créer d'interface sur la page (en dehors de la fenêtre prompt pour indiquer le choix de l'utilisateur).

                                                Voilà le code de mon programme :

                                                class Contact
                                                	{
                                                		constructor(prenom,nom)
                                                			{
                                                				this.prenom = prenom
                                                				this.nom = nom
                                                			}
                                                	}
                                                
                                                const listeContacts = [];
                                                
                                                listeContacts.push(new Contact ("Carole", "Lévisse"));
                                                listeContacts.push(new Contact ("Mélodie", "Nelsonne"));
                                                
                                                
                                                console.log("Bonjour et bienvenue sur votre gestionnaire de contacts :)");
                                                
                                                let interrupteur = 0 ;
                                                
                                                while (interrupteur === 0)
                                                	{
                                                		console.log("Que voulez-vous faire ?\n1 : Afficher les contacts\n2 : Ajouter un contact\n0 : Quitter");
                                                		const choix = prompt("Que voulez-vous faire ?");
                                                		if (choix === "1")
                                                			{
                                                				console.log("Voiçi la liste de tous vos contacts:")
                                                				listeContacts.forEach(contact => console.log(`- ${contact.prenom} ${contact.nom}`));
                                                			}
                                                		else if (choix === "2")
                                                			{
                                                			 	const nouvPrenom = prompt("Prénom de votre nouveau contact ?");
                                                			 	const nouvNom = prompt("Nom de votre nouveau contact ?");
                                                			 	listeContacts.push(new Contact (nouvPrenom, nouvNom));
                                                			 	console.info(`Votre contact ${nouvPrenom} ${nouvNom} a bien été ajouté.`)
                                                			}
                                                		else if (choix === "0")
                                                			{
                                                				interrupteur = 1 ;
                                                			}
                                                	}
                                                
                                                console.log("Au revoir !");

                                                Il me semble qu'il fonctionne parfaitement, et même si je me pourrai me faire à l'idée de ne pas avoir mon certificat de réussite je voulais savoir s'il était possible de retenter ma chance ? :euh:

                                                • Partager sur Facebook
                                                • Partager sur Twitter
                                                  21 février 2019 à 18:28:30

                                                  Bonjour, avec la note de 6/11, je n'ai pas réussi le dernier exercice selon un bête faute. Est-il possible de le recommencer afin d'avoir le certificat ?
                                                  • Partager sur Facebook
                                                  • Partager sur Twitter
                                                    26 février 2019 à 20:51:50



                                                     Bonjour,

                                                    Je sèche un peut sur l'activité 2, je me demandais si quelqu'un pourrai m'aider.

                                                    Toute la boucle semble fonctionner , sauf le menu 0 qui permet de sortir du programme.

                                                    Je ne comprend pas pourquoi en tapant"0", le programme ne s'aiguille pas vers la sortie.

                                                    Si le code n'ai pas assez lisible ou si quelque chose vous dérange n’hésiter pas à me le dire , je suis preneur de tous conseils

                                                    /*ajout de contact*/
                                                    var Contact = {
                                                      init: function (nom, prenom) {
                                                        this.nom = nom;
                                                        this.prenom = prenom;
                                                      },
                                                      decrire: function() {
                                                        return "Nom : " + this.nom + ", prénom : " + this.prenom;
                                                      }
                                                    };
                                                    
                                                    
                                                    function ajoutContact(){
                                                      var newNom = prompt ("Entre un nom:");
                                                      var newPrenom = prompt ("Entrer un prenom");
                                                    
                                                      var newContact = Object.create(Contact);
                                                      newContact.init (newNom, newPrenom);
                                                    
                                                      contact.push(newContact);
                                                    
                                                      console.log("Le nouveau contact a été pris en compte");
                                                      console.log("");
                                                    }
                                                    
                                                    
                                                    var contact1 = Object.create(Contact);
                                                    contact1.init("Levisse", "Carole");
                                                    
                                                    var contact2 = Object.create(Contact);
                                                    contact2.init("Nelsonne", "Melodie");
                                                    
                                                    /*tableau*/
                                                    var contact = [];
                                                    contact.push(contact1);
                                                    contact.push(contact2);
                                                    
                                                    
                                                    /*quitter*/
                                                    function quitter() {
                                                      console.log("sorti du programme");
                                                    }
                                                    
                                                    
                                                    /*boucle while*/
                                                    console.log("Vous etes dans le gestionnaire de contacts!");
                                                    var menu;
                                                    while (menu !== 0) {
                                                        console.log("1:Lister les contacts");
                                                        console.log("2:Ajouter un contact");
                                                        console.log("0:Quitter");
                                                        //console.log("");
                                                        var menu = prompt("Choississer une option:");
                                                    
                                                        switch(menu){
                                                          case"1":
                                                          console.log ("détail de la liste de contacts:");
                                                          for (var i = 0; i < contact.length; i++) {
                                                            console.log(contact[i].decrire());
                                                          }
                                                            break;
                                                            
                                                          case "2":
                                                            ajoutContact();
                                                            break;
                                                            
                                                          }
                                                        }
                                                        quitter();
                                                        console.log("Fin du programme");
                                                       
                                                    
                                                    Merci de m'avoir lu
                                                    • Partager sur Facebook
                                                    • Partager sur Twitter
                                                      27 février 2019 à 2:16:17

                                                      Bonjour à tous ! J'en suis à la fin du cours et je me posais une question sur le dernier exercice : pourquoi on est obligé de mettre console.log dans le forEach alors que la fonction decrire() a déjà un return ? Ou dans l'autre sens, pourquoi on est obligé de mettre console.log dans la fonction decrire() à la place du return si on fait que appeler la fonction dans le forEach (comme j'ai fais) ? Ou plus simplement, pourquoi juste avec le return de la fonction decrire() ça ne marche pas ?

                                                      • Partager sur Facebook
                                                      • Partager sur Twitter
                                                        27 février 2019 à 11:46:51

                                                        Fonkyjoy : Le problème viens de l'imbrication de tes éléments il faut faire en sort que le programme s’exécute étape par étape. 

                                                        FlorianIlles : return renvoi une valeur et console.log affiche une valeur/un résultat donc pour afficher dans la console la valeur renvoyé il faut passer par console.log. Si ta fonction utilises console.log alors il suffit d'appeler la fonction pour que le résultat s'affiche. 

                                                        • Partager sur Facebook
                                                        • Partager sur Twitter
                                                        Passer pour un idiot aux yeux d'un imbécile est une volupté de fin gourmet.
                                                          27 février 2019 à 14:23:10

                                                          Merci ! Faudrait que je revoie cette partie du cours, ça m'a un peu échappé :/
                                                          • Partager sur Facebook
                                                          • Partager sur Twitter
                                                            11 mars 2019 à 12:03:38

                                                            Bonjour à toutes et à tous! J'ai un petit problème concernant JavaScript.
                                                            Je ne sais pas comment récupérer le contenu d'une balise(exemple : <select id="list"><option>....</select>

                                                             Je veux récupérer le contenu de la balise option. qu'est ce que je dois faire?

                                                            Besoin de votre coup de main s'il vous plait. Merci.



                                                            <!DOCTYPE html>
                                                            <html>
                                                                <head>
                                                                    <meta charset='utf-8'/>
                                                                    <link rel='stylesheet' href='../css/style.css'/>
                                                                    <link rel='stylesheet' href='../css/flatly.css'/>
                                                                </head>
                                                                <body>
                                                                    <div id='main_wrapper'>
                                                                        <header>
                                                                            <!-- Depuis Navbar1 du thème flatly de bootswatch.com-->
                                                                            <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
                                                                                <a class="navbar-brand" href="#">MAHTP</a>
                                                                                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor01" aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation">
                                                                                    <span class="navbar-toggler-icon"></span>
                                                                                </button>
                                                            
                                                                                <div class="collapse navbar-collapse" id="navbarColor01">
                                                                                    <ul class="navbar-nav mr-auto">
                                                                                        <li class="nav-item active">
                                                                                            <a class="nav-link" href="formulaire.php">Formulaire<span class="sr-only">(current)</span></a>
                                                                                        </li>
                                                                                        <li class="nav-item">
                                                                                            <a class="nav-link" href="all.php">Listes</a>
                                                                                        </li>
                                                                                        <li class="nav-item">
                                                                                            <a class="nav-link" href="#">Pricing</a>
                                                                                        </li>
                                                                                        <li class="nav-item">
                                                                                            <a class="nav-link" href="#">About</a>
                                                                                        </li>
                                                                                    </ul>
                                                                                    <form class="form-inline my-2 my-lg-0">
                                                                                        <input class="form-control mr-sm-2" type="text" placeholder="Search">
                                                                                        <button class="btn btn-secondary my-2 my-sm-0" type="submit">Search</button>
                                                                                    </form>
                                                                                </div>
                                                                            </nav>
                                                                            <!--fin du navbar1 du thème flatly de bootswatch.com-->
                                                                            <p id="en_tete">FICHE INDIVIDUELLE</p>
                                                                        </header>
                                                                        <div class='separator'>&nbsp;</div>
                                                                        <section>
                                                                            <div class='block_card2'>
                                                                                <div class="card text-white bg-primary mb-3" style="max-width: 20rem;">
                                                                                    <div class="card-header">Header</div>
                                                                                    <div class="card-body">
                                                                                        <h4 class="card-title">Primary card title</h4>
                                                                                        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
                                                                                    </div>
                                                                                </div>
                                                                                <div class="card text-white bg-danger mb-3" style="max-width: 20rem;">
                                                                                    <div class="card-header">Header</div>
                                                                                    <div class="card-body">
                                                                                        <h4 class="card-title">Danger card title</h4>
                                                                                        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
                                                                                    </div>
                                                                                </div>
                                                                                <div class="card text-white bg-warning mb-3" style="max-width: 20rem;">
                                                                                    <div class="card-header">Header</div>
                                                                                    <div class="card-body">
                                                                                        <h4 class="card-title">Warning card title</h4>
                                                                                        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
                                                                                    </div>
                                                                                </div>
                                                                                <div class="card bg-light mb-3" style="max-width: 20rem;">
                                                                                    <div class="card-header">Header</div>
                                                                                    <div class="card-body">
                                                                                        <h4 class="card-title">Light card title</h4>
                                                                                        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                            <form method='post' action='traitement_insert.php'>
                                                                                <div id='bloc_field'>
                                                                                    <div id='fieldgroup1'>
                                                                                        <fieldset id='field1'>
                                                                                            <legend>Information générale de l'employé(e)</legend>
                                                                                            <p>
                                                                                                <table>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='sit_indiv'>Situation individuelle :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <select name="sit_indiv" id="sit_indiv">
                                                                                                                <option value="HEE">HEE</option>
                                                                                                                <option value="FONCTIONNAIRE">FONCTIONNAIRE</option>
                                                                                                                <option value="EFA">EFA</option>
                                                                                                                <option value="ELD">ELD</option>
                                                                                                            </select>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <label for='num_mat'>Numéro matricule :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' maxlength='20' name='num_mat' id='num_mat' placeholder='' title='Veuillez insérez votre numéro matricule' required/><br/>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            Grade actuelle :
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <label for="ga_classe">Classe</label>
                                                                                                            <select name="ga_classe" id="ga_classe">
                                                                                                                <option value="stagiaire">Stagiaire</option>
                                                                                                                <option value="deuxieme_classe">Deuxième classe</option>
                                                                                                                <option value="premiere_classe">Première classe</option>
                                                                                                                <option value="classe_principale">Classe principale</option>
                                                                                                                <option value="classe_exceptionnelle">Classe exceptionnelle</option>
                                                                                                            </select>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <label for="ga_echelon">Échelon</label>
                                                                                                            <select name="ga_echelon" id="ga_echelon">
                                                                                                                <option value="">Aucun</option>
                                                                                                                <option value="premiere_echelon">1ère échelon</option>
                                                                                                                <option value="deuxieme_echelon">2ème échelon</option>
                                                                                                                <option value="troisieme_echelon">3ème échelon</option>
                                                                                                            </select>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            Sexe :
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='radio' name='sexe' id='f' value='F'/><label for='f'> Féminin</label>
                                                                                                            <input type='radio' name='sexe' id='m' value='M'/><label for='m'> Masculin</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <label for='corps'>Corps :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <select name="corps" id="corps">
                                                                                                                <option value="aucun" id="corps_op1" onclick="ga_func('aucun');">Aucun</option>
                                                                                                                <option value="sous operateur"  id="corps_op2" onclick="ga_func('sous_operateur');">sous_opérateur</option>
                                                                                                                <option value="operateur" onclick="ga_func('operateur');">Opérateur</option>
                                                                                                                <option value="encadreur" onclick="ga_func('encadreur');">Encadreur</option>
                                                                                                                <option value="technicien superieur" onclick="ga_func('technicien_superieur');">Technicien supérieur</option>
                                                                                                                <option value="realisateur adjoint" onclick="ga_func('realisateur_adjoint');">Réalisateur adjoint</option>
                                                                                                                <option value="realisateur" onclick="ga_func('realisateur');">Réalisateur</option>
                                                                                                                <option value="concepteur" onclick="ga_func('concepteur');">Concepteur</option>
                                                                                                            </select>
                                                                                                            <script> 
                                                                                                                function ga_func(var c){
                                                                                                                    alert(document.getElementById("corps"));
                                                                                                                }
                                                                                                            </script>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            Personne à contacter en cas d'urgence :
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='contact_urg_nom' placeholder='nom' /><br/>
                                                                                                            <input class='champtxt' type='tel' name='contact_urg_tel' maxlength='10' placeholder='numéro téléphone'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                </table>
                                                                                            </p>
                                                                                        </fieldset>
                                                                                        <fieldset id='field2'>
                                                                                            <legend>ETAT CIVIL</legend>
                                                                                            <p>
                                                                                                <table class='tab_sa'>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='nom'>Nom :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='nom' id='nom' size='30' maxlength='50' required/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='prenom'>Prénom :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='prenom' id='prenom' size='30' maxlength='50' required/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='cin'>CIN :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='cin' id='cin' size='30' maxlength='12' required/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                </table>
                                                                                                <table class='tab_sa'>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='date_naiss'>Date de naissance :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='date_naiss' id='date_naiss' size='30' maxlength='50' placeholder='aaaa-mm-jj' required/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='lieu_naiss'>Lieu de naissance :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='lieu_naiss' id='lieu_naiss' size='30' maxlength='50' required/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='lot'>Lot :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input type='text' class='champtxt' name='lot' id='lot' size='30' required/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    
                                                                                                </table>
                                                                                            </p>
                                                                                        </fieldset>
                                                                                        <fieldset id='field3'>
                                                                                            <legend>SITUATION FAMILIALE</legend>
                                                                                            <table class='tab_sf'>
                                                                                                <tr>
                                                                                                    <td>
                                                                                                        Situation familiale :
                                                                                                    </td>
                                                                                                    <td>
                                                                                                        <input class='champtxt' type='radio' name='sit_amour' id='celibataire' onclick="clfunction();" value='celibataire'/><label for='celibataire'>Célibataire</label>
                                                                                                        <input class='champtxt' type='radio' name='sit_amour' id='marie' onclick="mrfunction();" value='marie'/><label for='marie'>Marié(e)</label><br/>
                                                                                                        <input class='champtxt' type='radio' name='sit_amour' id='divorce' value='divorce'/><label for='divorce'>Divorcé(e)</label>&nbsp;
                                                                                                        <input class='champtxt' type='radio' name='sit_amour' id='Veuf' value='veuf'/><label for='veuf'>Veuf/Veuve</label>
                                                                                                    </td>
                                                                                                </tr>
                                                                                            </table>
                                                                                            <div id='mr'></div>
                                                                                            <script>
                                                                                                function clfunction(){
                                                                                                    document.getElementsByTagName("div");
                                                                                                    div.id = "ms";
                                                                                                }
                                                                                                function mrfunction(){
                                                                                                    var sure = confirm("Êtes-vous bien sûre que vous êtes bien marié(e)?");
                                                                                                    if(sure){
                                                                                                        var a = "<table class='tab_sf'><tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='date_mar'>Date du mariage civil :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='date' name='date_mar' id='date_mar' size='30'>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<strong>Renseignements sur le conjoint(e)</strong>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='nomc'>Nom :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='nomc' id='nomc' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='prenomc'>Prénom :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='prenomc' id='prenomc' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='date_naissc'>Date de naissance :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='date' name='date_naissc' id='date_naissc' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='fonction_c'>Fonction :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='fonction_c' id='fonction_c' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='Societe_emp'>Société employeur :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='societe_emp' id='societe_emp' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "</table>";
                                                                                                        a += "<table class='tab_sf'>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='tel_c'>Téléphone :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='tel' name='tel_c' id='tel_c' size='30'/>";
                                                                                                        a += "</td>";                                                
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<strong>Pour le conjoint(e) fonctionnaire</strong>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='min_emp_c'>Ministère employeur :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='min_emp_c' id='min_emp_c' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='corps_c'>Corps :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='corps_c' id='corps_c' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='num_matc'>Numéro matricule :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='num_matc' id='num_matc' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='fonction_c2'>Fonction :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='fonction_c2' id='fonction_c2' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "<tr>";
                                                                                                        a += "<td>";
                                                                                                        a += "<label for='loc_servicec'>Localité de service :</label>";
                                                                                                        a += "</td>";
                                                                                                        a += "<td>";
                                                                                                        a += "<input class='champtxt' type='text' name='loc_servicec' id='loc_servicec' size='30'/>";
                                                                                                        a += "</td>";
                                                                                                        a += "</tr>";
                                                                                                        a += "</table>";
                                                                                                        var retr = document.getElementById("mr");
                                                                                                        retr.innerHTML = a;
                                                                                                    }
                                                                                                }
                                                                                            </script>   
                                                                                        </fieldset>
                                                                                        <fieldset id='field6'><legend>Renseignements sur les enfants (moins de 21 ans)</legend>
                                                                                            <table>
                                                                                                <tr>
                                                                                                    <td>
                                                                                                        <strong>Veuillez indiquer le nombre de vos enfants (moins de 21 ans) : </strong>
                                                                                                    </td>
                                                                                                    <td>
                                                                                                        <input type='button' value="combien d'enfants avez-vous?" id='nb_enfant_button' onclick="kidfunction();"/>
                                                                                                    </td>
                                                                                                </tr>
                                                                                            </table>
                                                                                            <script>
                                                                                                function kidfunction(){
                                                                                                    var n = parseInt(prompt("Combien d'enfants avez-vous? (moins de 21 ans)"));
                                                                                                    
                                                                                                    if (n > 0){
                                                                                                        var x = "<input type='text' name='nb_enfant' value='" + n + "' hidden /><table class='jstable'><tr><th class='jsth'>Numéro</th><th class='jsth'>Nom</th><th class='jsth'>Prénom</th><th class='jsth'>Date de naissance</th><th class='jsth'>Sexe</th><th class='jsth'>Classe</th><th class='jsth'>Observations</th></tr>";
                                                                                                        for (var i = 1 ; i<=n ; i++){
                                                                                                            x += "<tr>";
                                                                                                            x += "<td class='jstd'><span name='numkid" + i + "' id='numkid" + i + "' size='2'>" + i + "</span></td>";
                                                                                                            x += "<td class='jstd'><input type='text' class='champtxt' name='nomkid" + i + "' id='nomkid" + i + "' size='15' required/></td>";
                                                                                                            x += "<td class='jstd'><input type='text' class='champtxt' name='pnomkid" + i + "' id='pnomkid" + i + "'size='15' required/></td>";
                                                                                                            x += "<td class='jstd'><input type='text' class='champtxt' name='dnaisskid" + i + "' id='dnaisskid" + i + "'size='8' required/></td>";
                                                                                                            x += "<td class='jstd'><p id='paragraph_kid'><input type='radio' name='sexekid" + i + "' id='masculin' value='masculin' size='30'/><label for='masculin'>M</label><input type='radio' name='sexekid" + i + "' id='feminin' value='feminin'/><label for='feminin'>F</label></p></td>"
                                                                                                            x += "<td class='jstd'><input type='text' class='champtxt' name='classekid" + i + "' id='classekid" + i + "' size='10'/></td>";
                                                                                                            x += "<td class='jstd'><input type='text' class='champtxt' name='obskid" + i + "' id='obskid" + i + "' size='10'/></td>";
                                                                                                            x += "</tr>";
                                                                                                        }
                                                                                                        x += "</table></fieldset>";
                                                                                                        var retour = document.getElementById("valret");
                                                                                                        retour.innerHTML = x;
                                                                                                    }else{
                                                                                                        var x = "<input type='text' name='nb_enfant' value='0' hidden /><p id='no_kid'>PAS D'ENFANTS</p></fieldset>";
                                                                                                        var retour = document.getElementById("valret");
                                                                                                        retour.innerHTML = x;
                                                                                                    }
                                                                                                }
                                                                                            </script>
                                                                                            <div id='valret'></div>
                                                                                        </fieldset>
                                                                                    </div>
                                                                                    <div id='fieldgroup2'>
                                                                                        <fieldset id='field4'>
                                                                                            <legend>SITUATION ADMINISTRATIVE</legend>
                                                                                            <p>
                                                                                                <table class='tab_sa'>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='date_entr_admin'>Date d'entrée dans <br/>l'administration :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='date' name='date_entr_admin' id='date_entr_admin' size='30'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='Corps_a'>Corps :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <select name="corps_a" id="corps_a">
                                                                                                                <option value="aucun">Aucun</option>
                                                                                                                <option value="sous operateur">sous_opérateur</option>
                                                                                                                <option value="operateur">Opérateur</option>
                                                                                                                <option value="encadreur">Encadreur</option>
                                                                                                                <option value="technicien superieur">Technicien supérieur</option>
                                                                                                                <option value="realisateur adjoint">Réalisateur adjoint</option>
                                                                                                                <option value="realisateur">Réalisateur</option>
                                                                                                                <option value="concepteur">Concepteur</option>
                                                                                                            </select>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <p>Grade actuelle :</p>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <select name="grade_actu_classe_a" id="grade_actu_classe_a">
                                                                                                                <option value="stagiaire">Stagiaire</option>
                                                                                                                <option value="deuxième classe">Deuxième classe</option>
                                                                                                                <option value="première classe">Première classe</option>
                                                                                                                <option value="classe principale">Classe principale</option>
                                                                                                                <option value="classe exceptionnelle">Classe exceptionnelle</option>
                                                                                                            </select>
                                                                                                                <select name="grade_actu_echelon_a" id="grade_actu_echelon_a">
                                                                                                                <option value=" ">Aucun</option>
                                                                                                                <option value="1ere échelon">1ère échelon</option>
                                                                                                                <option value="2eme échelon">2ème échelon</option>
                                                                                                                <option value="3eme échelon">3ème échelon</option>
                                                                                                            </select>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='cadre_a'>Cadre :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <select name='cadre_a' id='cadre_a'>
                                                                                                                <option>Aucun</option>
                                                                                                                <option>A1</option>
                                                                                                                <option>A2</option>
                                                                                                                <option>A3</option>
                                                                                                                <option>B1</option>
                                                                                                                <option>B2</option>
                                                                                                                <option>B3</option>
                                                                                                            </select>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='fonc_actu_a'>Fonction actuelle :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='fonc_actu_a' id='fonc_actu_a' size='30'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='mission_pple_agent'>Mission principale de l'agent<br/>liée à sa fonction :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='mission_pple_agent' id='mission_pple_agent' size='30'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='service_a'>Service :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='service_a' id='service_a' size='30'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                </table>
                                                                                                <table class='tab_sa'>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='direction_a'>Direction :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='direction_a' id='direction_a' size='30'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='direction_gle_a'>Direction générale :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='direction_gle_a' id='direction_gle_a' size='30'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='imput_budg'>Imputation budgétaire :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='imput_budg' id='imput_budg' size='30'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <p>Code de payement :</p>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input type='radio' name='payement' value='bon de caisse' id='bon_de_caisse'/>
                                                                                                            <label for='bon_de_caisse'>BON DE CAISSE</label>
                                                                                                            <br/>
                                                                                                            <input type='radio' name='payement' value='virement bancaire' id='virement_bancaire'/>
                                                                                                            <label for='virement_bancaire'>VIREMENT BANCAIRE</label>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='code_banque'>Code banque :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='code_banque' id='code_banque' size='30' maxlength='10'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='num_compte'>Numéro de compte :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='text' name='num_compte' id='num_compte' size='30' maxlength='13'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                    <tr>
                                                                                                        <td>
                                                                                                            <label for='num_tel'>Numéro de téléphone de l'agent :</label>
                                                                                                        </td>
                                                                                                        <td>
                                                                                                            <input class='champtxt' type='tel' name='num_tel' id='num_tel' size='30' maxlength='15'/>
                                                                                                        </td>
                                                                                                    </tr>
                                                                                                </table>
                                                                                            </p>
                                                                                        </fieldset>
                                                                                    </div>
                                                                                    <div id='fieldgroup3'>
                                                                                        <fieldset id='field5'>
                                                                                            <legend>Avancements successifs</legend>
                                                                                            <p>
                                                                                                <!--ajout de quelque chose-->
                                                                                                <label for='avancement_button'>Nombre d'avancement : </label>
                                                                                                <input type='button' value="nombre d'avancement" id='avancement_button' onclick="av_function();"/>
                                                                                                <div id='avancements'></div>
                                                                                                <script>
                                                                                                    function av_function(){
                                                                                                        do{
                                                                                                            do{
                                                                                                                var nb = parseInt(prompt('Veuillez indiquer le nombre de votre avancement'));
                                                                                                                var y = "<input type='text' name='nb_avancement' value='" + nb + "' hidden /><table class='jstable'><tr><th class='jsth'>Ref acte (contrat de travail, arrêté, décision d'engagement pour les ECD</th><th class='jsth'>Corps</th><th class='jsth'>Grade</th><th class='jsth'>Indice</th><th class='jsth'>Date d'effet</th></tr>";
                                                                                                                for (var i = 1 ; i <= nb ; i++){
                                                                                                                    y += "<tr><td class='jstd'><input type='text' class='champtxt' name='ref" + i + "' id='ref" + i + "' size='20'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='corps" + i + "' id='corps" + i + "' size='20'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='grade" + i + "' id='grade" + i + "' size='10'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='indice" + i + "' id='indice" + i + "' size='4' maxlength='4' /></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='date_effet" + i + "' id='date_effet" + i + "' size='10' maxlength='10'/></td>";
                                                                                                                }
                                                                                                                y += "</tr></table>";
                                                                                                                var retour = document.getElementById("av_successifs");
                                                                                                                retour.innerHTML = y;
                                                                                                            }while(!nb);
                                                                                                        }while(nb <1);
                                                                                                    }
                                                                                                </script>
                                                                                            </p>
                                                                                            <div id='av_successifs'></div>
                                                                                        </fieldset>
                                                                                        <fieldset id='field7'>
                                                                                            <legend>Affectations successives</legend>
                                                                                            <p>
                                                                                                <!--ajout de quelque chose-->
                                                                                                <label for='affectation_button'>Nombre d'affectation : </label>
                                                                                                <input type='button' value="nombre d'affectation" id='affectation_button' onclick="af_function();"/>
                                                                                                <div id='affectations'></div>
                                                                                                <script>
                                                                                                    function af_function(){
                                                                                                        do{
                                                                                                            do{
                                                                                                                var nb = parseInt(prompt('Veuillez indiquer le nombre de votre affectation'));
                                                                                                                var y = "<input type='text' name='nb_affectation' value='" + nb + "' hidden /><table class='jstable'><tr><th class='jsth'>Direction</th><th class='jsth'>Service</th><th class='jsth'>Fonction</th><th class='jsth'>Ref precis note de service/decision d'affectation/arrêté</th><th class='jsth'>Observations</th></tr>";
                                                                                                                for (var i = 1 ; i <= nb ; i++){
                                                                                                                    y += "<tr><td class='jstd'><input type='text' class='champtxt' name='direction" + i + "' id='direction" + i + "' size='20'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='service" + i + "' id='service" + i + "' size='20'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='fonction" + i + "' id='fonction" + i + "' size='10'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='ref_note" + i + "' id='ref_note" + i + "' size='4' maxlength='4' /></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='obsaffect" + i + "' id='observations" + i + "' size='10' maxlength='10'/></td>";
                                                                                                                }
                                                                                                                y += "</tr></table>";
                                                                                                                var retour = document.getElementById("affectations");
                                                                                                                retour.innerHTML = y;
                                                                                                            }while(!nb);
                                                                                                        }while(nb <1);
                                                                                                    }
                                                                                                </script>
                                                                                            </p>
                                                                                        </fieldset>
                                                                                        <fieldset id='field8'>
                                                                                            <legend>Etudes, stages et formations</legend>
                                                                                            <p>
                                                                                                <!--ajout de quelque chose-->
                                                                                                <label for='esf_button'>Veuillez indiquer le nombre d'etude, de stage ou de formation que vous avez parcouru : </label>
                                                                                                <input type='button' value="nombre d'études, de stages et de formations" id='esf_button' onclick="esf_function();"/>
                                                                                                <div id='esfs'></div>
                                                                                                <script>
                                                                                                    function esf_function(){
                                                                                                        do{
                                                                                                            do{
                                                                                                                var nb = parseInt(prompt("Veuillez indiquer le nombre d'etude, de stage ou de formation que vous avez parcouru"));
                                                                                                                var y = "<input type='text' name='nb_esf' value='" + nb + "' hidden /><table class='jstable'><tr><th class='jsth'>Thème</th><th class='jsth'>Période</th><th class='jsth'>Organisme(ville/pays)</th><th class='jsth'>Diplôme ou certificat</th><th class='jsth'>Observations</th></tr>";
                                                                                                                for (var i = 1 ; i <= nb ; i++){
                                                                                                                    y += "<tr><td class='jstd'><input type='text' class='champtxt' name='theme" + i + "' id='direction" + i + "' size='35'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='periode" + i + "' id='service" + i + "' size='35'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='organisme" + i + "' id='fonction" + i + "' size='35'/></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='diplome" + i + "' id='ref_note" + i + "' size='35'  /></td>";
                                                                                                                    y += "<td class='jstd'><input type='text' class='champtxt' name='obsesf" + i + "' id='observations" + i + "' size='35' /></td>";
                                                                                                                }
                                                                                                                y += "</tr></table>";
                                                                                                                var retour = document.getElementById("esfs");
                                                                                                                retour.innerHTML = y;
                                                                                                            }while(!nb);
                                                                                                        }while(nb <1);
                                                                                                    }
                                                                                                </script>
                                                                                            </p>
                                                                                        </fieldset>
                                                                                    </div>
                                                                                </div> <!--div bloc_field-->
                                                                                <p id='pvalid'>
                                                                                    <input type='submit' class='validation' value='envoyer'/>
                                                                                    <input type='reset' class='validation' value='Annuler'/>
                                                                                </p>
                                                                            </form>
                                                                        </section>
                                                                        <?php
                                                                            include('includes/footer.php');
                                                                        ?>
                                                                    </div><!--div main_wrapper-->
                                                                </body>
                                                            </html>
                                                            • Partager sur Facebook
                                                            • Partager sur Twitter
                                                              11 mars 2019 à 12:23:17

                                                              Bonjour,

                                                              Comment faites vous pour l'activité 2 ?

                                                              http://exercices.openclassrooms.com/assessment/359?id=2984401&slug=apprenez-a-coder-avec-javascript&login=6966989&tk=5d5279da02ef1ecbdaa96c150e141132&sbd=2016-02-01&sbdtk=2466d6bae51e373d89ac8e3f74213199

                                                              La commande prompte semble bloquer les console.log...

                                                              Pour une raison inconnue, la fenêtre du prompt s'affiche et du coup les console.log bien que mis avant ne s'affichent jamais.
                                                              Sur Firefox, cela fonctionne très bien mais je n'ai pas envie d'avoir un 0, si le correcteur utilise Chrome... :-°

                                                              Cela semble marcher si je mets un timer de 2 secondes avant le prompt mais j'imagine que c'est un bricolage qui n'est pas accepté o_O

                                                              des conseils ?

                                                              Extrait du code :

                                                              console.log("Bienvenue dans le gestionnaire des contacts !");
                                                              
                                                              let choix;
                                                              while (choix !== "0") {
                                                                  console.log("\n 1: Lister les contacts \n 2: Ajouter un contact \n 0: Quitter");
                                                                  choix = prompt("Choisissez une option :");



                                                              • Partager sur Facebook
                                                              • Partager sur Twitter

                                                              Cours Apprenez à coder avec JavaScript

                                                              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                                                              × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                                                              • Editeur
                                                              • Markdown