Un exemple de liste déroulante liée à un input de type text.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="fr" xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Exemple de liste de choix liée à un élément textbox</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
function showlist() {
var textsec=document.getElementById("secteurs");
var divlist=document.getElementById("list_sec");
with (divlist) {
with (style) {
border="thin solid grey";
width=document.getElementById("listsec").style.width;
height="60px";
overflow="auto";
visibility="visible";
}
}
}
function selsec(secteur) {
document.getElementById("secteurs").value=secteur;
document.getElementById("list_sec").style.visibility="hidden";
}
</script>
</head>
<body>
<form method="post" action="">
<table>
<tr>
<td><label for="secteurs">Secteurs :</label></td>
<td><input type="text" id="secteurs" name="secteurs" onclick="showlist()" /></td>
</tr>
<tr>
<td> </td>
<td><div id="list_sec" style="visibility:hidden">
<table id="listsec">
<?foreach($list_job as $job){?>
<tr><td onclick="selsec('<?= $job->job_label;?>')"><?= $job->job_label;?></td></tr>
<?}?>
</table>
</div></td>
</tr>
</table>
</form>
</body>
</html>
Ceci devrait répondre à votre problématique.
Bon courage!...