1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Lister les intervenants</title>
<style type="text/css">
body {
margin: 0;
padding: 0;
}
#global {
position:absolute;
left: 50%;
top: 50%;
width: 700px;
height: 400px;
margin-top: -200px;
margin-left: -350px;
border: 1px solid #333;
background-color: #eee;
}
#liste {
width: 280px;
left: 10%;
top: 10%;
position: relative;
}
.titre{
color: #FFF;
font-family: Tahoma;
font-size: 12px;
background-color: #0000FF;
text-align: center;
}
.etq{
font-family: Tahoma;
color: #000;
font-size: 12px;
text-align: left;
width: 120px;
display: inline-block;
}
.chp {text-align: left ;}
.bouton {float: right ; background:red;}
.tbl { border: 1px solid #0000FF;width:280px;}
</style>
</head>
<body>
<form name="gie" id="gie" action="" method="post">
<table class="tbl">
<tbody>
<tr>
<td class="titre">Lister les intervenants</td>
</tr>
<tr>
<td><p id="l1"><span class="etq">Lister les intervenants</span>
<select id="sel1" name="sel1">
<option value="-1" selected="selected">Selectionner</option>
<option value="1">Par Ecole</option>
<option value="2">Par Discipline</option>
<option value="3">Par Localisation</option>
<option value="4">Par Circonscription</option>
</select>
</p>
<p id="l2" style="display:none;"><span class="etq">Trié par</span>
<select id="sel2" name="sel2">
<option selected="selected" value="nomint">Nom</option>
<option value="numagr">Numéro agr.</option>
</select>
</p>
<p id="l3" style="display:none;"><span class="etq">Sigle</span>
<select id="sel3" name="sel3">
<option selected="selected" value="EMC">EMC</option>
<option value="EPC">EPC</option>
<option value="ECU">ECU</option>
</select>
</p>
<p id="l4" style="display:none;"><span class="etq">Ecole</span>
<select id="sel4" name="sel4">
<option>Indifferent</option>
</select>
</p>
<p id="ok" style="display:none"><span class="etq"></span>
<input class="bouton" name="B1" id="B1" style="border: solid; float: right; background-color: #FF0000; font-size: x-small; display:block" type="submit" value="ok" />
</p></td>
</tr>
</tbody>
</table>
</form>
<script type="text/javascript"><!--
var liste=new Array (
new Array ( "Ecole1","Ecole2","Ecole3","Ecole4" ) ,
new Array ( "théâtre","informatique","langue vivante" ) ,
new Array ( "ville1","ville2","ville3" ),
new Array ( "zone1","zone2","zone3" )
);
var s1=document.getElementById("sel1");
var s4=document.getElementById("sel4");
s1.onchange=function()
{
if (s1.options[s1.selectedIndex].text === "Selectionner")
{
l2.style.display = "none";
l3.style.display = "none";
l4.style.display = "none";
ok.style.display = "none";
}
else
{
s4.length=0;
s4.length=liste[s1.selectedIndex-1].length;
for ( var n=0; n < liste[s1.selectedIndex-1].length; n++ )
{ s4.options[n].text=liste[s1.selectedIndex-1][n]; }
l2.style.display = "inline";
l3.style.display = "inline";
l4.style.display = "inline";
ok.style.display = "inline";
}
}
-->
</script>
</body>
</html> |
Partager