39 lines
917 B
HTML
39 lines
917 B
HTML
|
<!DOCTYPE html>
|
||
|
<html lang="en">
|
||
|
<head>
|
||
|
<meta charset="UTF-8">
|
||
|
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||
|
<title>Ajax</title>
|
||
|
<script src="js/serviceAjax.js"></script>
|
||
|
<script src="js/helpers.js"></script>
|
||
|
|
||
|
</head>
|
||
|
<body container>
|
||
|
<form action="">
|
||
|
<fieldset>
|
||
|
<label for="">Commune</label>
|
||
|
<input autocomplete=off list="communes" type="text">
|
||
|
<datalist id="communes"></datalist>
|
||
|
<button type="submit">Envoyer</button>
|
||
|
</fieldset>
|
||
|
</form>
|
||
|
</body>
|
||
|
<script>
|
||
|
let doRequest = debounce (search,500)
|
||
|
let input = document.querySelector("input")
|
||
|
let listes = document.querySelector("datalist")
|
||
|
input.addEventListener("input",doRequest)
|
||
|
|
||
|
let cache = []
|
||
|
async function search(ev){
|
||
|
|
||
|
let communes_promise = http.getVilles(input.value);
|
||
|
|
||
|
communes_promise.then(function(table) {
|
||
|
autocomplete(listes, table);
|
||
|
})
|
||
|
}
|
||
|
|
||
|
</script>
|
||
|
</html>
|