Récupérer la valeur d'une liste
Bonjour,
Je suis en train de bricoler une appli pour mon site, elle consiste à afficher un prix de revient du déplacement en fonction du code postal,
je voudrais récupérer la deuxième valeur que l'on peut insérer dans l'array list en cliquant sur un bouton tarif.
Voici mon fichier:
Code:
1
2
3
4
5
6
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Code postaux Y-Kars</title>
<style type="text/css"> |
Code:
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
| div#liste {
min-height:1.70em;
text-align:left;
position:relative;
right:52px;
border: solid 1px black;border-radius:5px;}
#liste{
border: solid 1px black; width: 355px;
overflow: auto;
display: none;
border-radius:5px;}
.result {
color: #ff6600;
background: white;
font: 1.25em "Arial Sans Serif";
border: solid 1px black;border-radius:5px}
.result:hover {
color: white;
background: #ff6600;
cursor : Default;}
#total{
color: #FF0000;
background: white;
font: 1.25em "Arial Sans Serif" ;
font-weight: bold;
width : 100px; height : 30px;
text-align:center;
border: solid 1px black;border-radius:5px}
#calculer{
color: #ff0000;
font: 1.25em "Arial Sans Serif";
width : 100px; height : 30px;
border-radius:5px;
cursor : pointer;}
#Effacer{
width : 100px; height : 30px;
font: 1.25em "Arial Sans Serif";
border-radius:5px;
cursor : pointer;}
#champ{
width: 350px;height: 30px;
font: 1.25em "Arial Sans Serif";
border: solid 1px black;border-radius:5px;}
body {
background-image:url(<a href="http://www.ykars.fr/medias/images/bacground-dep.png);" target="_blank">http://www.ykars.fr/medias/images/bacground-dep.png);</a>
background-repeat:no-repeat;
background-position: top 10px center;
color: white;}
p.montitre {
color: #ff6600;
font: 1.75em "Soniano Sans Unicode";}
p.soustitre {
color: #FFD700;
font: 1em "Arial Sans Serif";} |
Code:
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
| </style>
</head>
<form>
<body onload="document.getElementById('champ').focus()">
<div >
<div align="center";/>
<p class="montitre">Entrez votre code postal</>
<div style="font-family: Arial;"><span style="color: #f0000;font-size: 16px;">Puis cliquez ici >
<input type="button" name="calculer" id="calculer" value="Tarif" onclick="" />
<input type="text" name="total" id="total"value""><span style="color: #ff0000;"><strong> <span style="font-size: x-large;">€</span></strong></span></span></div><br>
<div onkeydown="return moveSelection()">
<input type="text" autocomplete="off" name="myCombo" id="champ"
onkeyup="window.setTimeout('refreshList();', 10); return getEnterKey()"/>
<input type="button" name="Effacer" id="Effacer" OnClick="javascript:window.location.reload()" value="Effacer">
<div id="liste"></div>
<p class="soustitre">(Moselle et Bas Rhin uniquement)</p></p>
</div>
</form>
<script type="text/javascript"> |
Code:
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
| // var selIndex = 0;
var nbMatch = 0;
var myArray = new Array();
var content = '';
var old = '';
function fillInput(i)
{
document.getElementById('champ').value = myArray[i];
document.getElementById('liste').style.display= 'none';
document.getElementById('champ').focus();
}
function refreshList()
{
if(document.getElementById('champ').value != old)
{
old=document.getElementById('champ').value;
document.getElementById('liste').innerHTML = '';
if (document.getElementById('champ').value.length > 0)
{
nbMatch = 0;
content='';
for (var i=0; i < myArray.length; i++)
{
if (myArray[i].slice(0, document.getElementById('champ').value.length).toUpperCase() == document.getElementById('champ').value.toUpperCase())
{
nbMatch++;
content += '<div id="' + nbMatch + '" class="result" onclick="fillInput(' + i + ')">' + myArray[i] + '</div>';
}
}
if (nbMatch)
{
document.getElementById('liste').innerHTML = content;
document.getElementById('liste').style.height = (Math.min(5, nbMatch)) + 'em';
document.getElementById('liste').style.display = 'block';
selIndex=0;
}
else
document.getElementById('liste').style.display = 'none';
}
else
{
document.getElementById('liste').style.display = 'none';
}
}
}
function moveSelection()
{
if (event.keyCode == 40)
{
if (selIndex > 0 && selIndex < nbMatch)
{
document.getElementById(selIndex)
}
if (selIndex < nbMatch)
{
selIndex++;
document.getElementById(selIndex)
document.getElementById(selIndex).focus();
}
return false;
}
else if (event.keyCode == 38)
{
if (selIndex > 1)
{
document.getElementById(selIndex)
}
if (selIndex > 1 && selIndex <= nbMatch)
{
selIndex--;
document.getElementById(selIndex)
}
return false;
}
return getEnterKey();
}
function getEnterKey()
{
if (event.keyCode == 13)
{
if (selIndex > 0)
{
document.getElementById('champ').value = document.getElementById(selIndex).innerText;
document.getElementById('liste').style.display = 'none';
old=document.getElementById(selIndex).innerText
}
return false;
}
else
{
return true;
}
}
{
myArray[0] = '57920 Aboncourt'; '1';
myArray[1] = '57590 Aboncourt-sur-Seille'; '2';
myArray[2] = '57560 Abreschviller'; '3';
myArray[3] = '57340 Achain'; '4';
myArray[4] = '57412 Achen'; '5';
myArray[5] = '57580 Adaincourt'; '6';
myArray[6] = '57380 Adelange'; '7';
myArray[7] = '57590 Ajoncourt'; '8';
myArray[8] = '57590 Alaincourt-la-Côte'; '9';
myArray[9] = '57670 Albestroff'; '10';
} |
Code:
1
2
3
| </script>
</body>
</html> |
Veuillez m'excuser pour les erreurs que vous pourrez trouver mais il fonctionne sur la partie afficher et sélectionner la commune et je bloque sur le reste, voilà ci quelqu'un de compétant et sympa pourrez m'aider je serais bien comptent.
