<!-- If the browser does not support frames put the first topic content here --> <div class="WordSection1"> <p class="MsoNormal">Fichier index.html :</p> <div style= 'border:solid windowtext 1.0pt;padding:1.0pt 4.0pt 1.0pt 4.0pt'> <p class="MsoNormal" style='border:none;padding:0cm'> <html></p> <p class="MsoNormal" style='border:none;padding:0cm'> <head></p> <p class="MsoNormal" style='border:none;padding:0cm'> <!-- les 4 lignes suivantes sont nécessaires pour utiliser bootstrap !--></p> <p class="MsoNormal" style='border:none;padding:0cm'> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"></p> <p class="MsoNormal" style='border:none;padding:0cm'> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script></p> <p class="MsoNormal" style='border:none;padding:0cm'> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script></p> <p class="MsoNormal" style='border:none;padding:0cm'> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script></p> <p class="MsoNormal" style='border:none;padding:0cm'> </p> <p class="MsoNormal" style='border:none;padding:0cm'> <script src='./messcripts.js'></script></p> <p class="MsoNormal" style='border:none;padding:0cm'> </head></p> <p class="MsoNormal" style='border:none;padding:0cm'> <body></p> <p class="MsoNormal" style='border:none;padding:0cm'> <h1>Saisie des personnes</h1></p> <p class="MsoNormal" style='border:none;padding:0cm'> <form id="f1" action="#"></p> <p class="MsoNormal" style='border:none;padding:0cm'> <div class="form-group"></p> <p class="MsoNormal" style='border:none;padding:0cm'> Civilité :</p> <p class="MsoNormal" style='border:none;padding:0cm'> <select id='civilite'></p> <p class="MsoNormal" style='border:none;padding:0cm'> <option>Madame</option></p> <p class="MsoNormal" style='border:none;padding:0cm'> <option>Monsieur</option></p> <p class="MsoNormal" style='border:none;padding:0cm'> </select></p> <p class="MsoNormal" style='border:none;padding:0cm'> </div></p> <p class="MsoNormal" style='border:none;padding:0cm'> <div class="form-group"></p> <p class="MsoNormal" style='border:none;padding:0cm'> <label for="nom">Nom:</label></p> <p class="MsoNormal" style='border:none;padding:0cm'> <input type="text" class="form-control" placeholder="Saisir le nom" id="nom"></p> <p class="MsoNormal" style='border:none;padding:0cm'> </div></p> <p class="MsoNormal" style='border:none;padding:0cm'> <div class="form-group"></p> <p class="MsoNormal" style='border:none;padding:0cm'> <label for="prenom">Prénom:</label></p> <p class="MsoNormal" style='border:none;padding:0cm'> <input type="text" class="form-control" placeholder="Saisir le prénom" id="prenom"></p> <p class="MsoNormal" style='border:none;padding:0cm'> </div></p> <p class="MsoNormal" style='border:none;padding:0cm'> <button type="button" class="btn btn-primary" <b>onClick="ajouter()"</b>>Ajouter</button></p> <p class="MsoNormal" style='border:none;padding:0cm'> <br/></p> <p class="MsoNormal" style='border:none;padding:0cm'> Liste des ajouts :</p> <p class="MsoNormal" style='border:none;padding:0cm'> <select id="aff_pers" <b>onClick="afficherDetails(this)"</b>></p> <p class="MsoNormal" style='border:none;padding:0cm'> </select></p> <p class="MsoNormal" style='border:none;padding:0cm'> </p> <p class="MsoNormal" style='border:none;padding:0cm'> <br/><br/></p> <p class="MsoNormal" style='border:none;padding:0cm'> <span id="affichageRecap"></p> <p class="MsoNormal" style='border:none;padding:0cm'> <h2>Détails des ajouts</h2></p> <p class="MsoNormal" style='border:none;padding:0cm'> <div class="card bg-success text-white"></p> <p class="MsoNormal" style='border:none;padding:0cm'> <div class="card-body"></p> <p class="MsoNormal" style='border:none;padding:0cm'> <span id = "details"></p> <p class="MsoNormal" style='border:none;padding:0cm'> </span></p> <p class="MsoNormal" style='border:none;padding:0cm'> </div></p> <p class="MsoNormal" style='border:none;padding:0cm'> </div></p> <p class="MsoNormal" style='border:none;padding:0cm'> </span></p> <p class="MsoNormal" style='border:none;padding:0cm'> </form></p> <p class="MsoNormal" style='border:none;padding:0cm'> </body></p> <p class="MsoNormal" style='border:none;padding:0cm'> </html></p> </div> <br clear="all" style='page-break-before:always' /> <p class="MsoNormal">Fichier javascript <i>messcripts.js</i> :</p> <div style= 'border:solid windowtext 1.0pt;padding:1.0pt 4.0pt 1.0pt 4.0pt'> <p class="MsoNormal" style='border:none;padding:0cm'><b>var tabPersonne = [];</b></p> <p class="MsoNormal" style='border:none;padding:0cm'><b>function ajouter()</b></p> <p class="MsoNormal" style='border:none;padding:0cm'><b>{</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> var aff_pers = document.getElementById("aff_pers");</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> var civil = document.getElementById("civilite");</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> var nom = document.getElementById("nom");</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> aff_pers.innerHTML += "<option>" + nom.value + "</option>";</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> var texte = civil.value + " " + prenom.value + " " + nom.value + "<br/>"; // Pour pouvoir afficher le détail ensuite</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> tabPersonne.push(texte);</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> civil.selectedIndex = 0;</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> nom.value="";</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> prenom.value="";</b></p> <p class="MsoNormal" style='border:none;padding:0cm'><b>}</b></p> <p class="MsoNormal" style='border:none;padding:0cm'><b>function afficherDetails(sel)</b></p> <p class="MsoNormal" style='border:none;padding:0cm'><b>{</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> var details = document.getElementById("details");</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> var index = sel.selectedIndex;</b></p> <p class="MsoNormal" style='border:none;padding:0cm'> <b> details.innerHTML = tabPersonne[index];</b></p> <p class="MsoNormal" style='border:none;padding:0cm'><b>}</b></p> </div> <p class="MsoNormal"> </p> </div>
Table des matières
Sujets
Recherche
Help content
Help content
Générée avec
chmProcessor
Générée avec
chmProcessor