Skip to content
Extraits de code Groupes Projets
Valider 7d235141 rédigé par Louis's avatar Louis
Parcourir les fichiers

autocomplétion

parent 74b54083
Aucune branche associée trouvée
Aucune étiquette associée trouvée
Aucune requête de fusion associée trouvée
Affichage de
avec 1203 ajouts et 105 suppressions
instagram-profil2.php
...@@ -29,6 +29,11 @@ if( isset($_POST['devis'])){ ...@@ -29,6 +29,11 @@ if( isset($_POST['devis'])){
<link rel="stylesheet" type="text/css" href="ressources/css/global.css"> <link rel="stylesheet" type="text/css" href="ressources/css/global.css">
<link rel="stylesheet" type="text/css" href="ressources/css/style.css"> <link rel="stylesheet" type="text/css" href="ressources/css/style.css">
<!-- pour autocomplétion -->
<link rel="stylesheet" type="text/css" href="ressources/css/smoothness/jquery-ui-1.10.3.custom.css">
<script type="application/javascript" src="ressources/js/jquery-1.9.1.js"></script>
<script type="application/javascript" src="ressources/js/jquery-ui-1.10.3.custom.js"></script>
<!--<link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet"> <!--<link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
--> -->
<?php /* <?php /*
...@@ -166,7 +171,7 @@ if( isset($_POST['devis'])){ ...@@ -166,7 +171,7 @@ if( isset($_POST['devis'])){
</div> </div>
<div class="col-md-8 clabel "> <div class="col-md-8 clabel ">
<div class=" padl has-feedback "> <div class=" padl has-feedback ">
<input type="text" name="email" id="form_email" value="" class="form-control " placeholder="Name Tag de ton influenceur"> <input type="text" name="email" id="form_email" value="" class="form-control " placeholder="Name Tag de ton influenceur"/>
</div> </div>
</div> </div>
<div class="col-md-2"> <div class="col-md-2">
...@@ -174,8 +179,6 @@ if( isset($_POST['devis'])){ ...@@ -174,8 +179,6 @@ if( isset($_POST['devis'])){
</div> </div>
</div> </div>
</form> </form>
<script src="ressources/js/autoCompletion.js">
</script>
<?php <?php
$result = $bdd->query("SELECT * FROM `influenceurs` ORDER BY `nom_artiste`"); $result = $bdd->query("SELECT * FROM `influenceurs` ORDER BY `nom_artiste`");
$tableau = array(); $tableau = array();
...@@ -184,7 +187,16 @@ if( isset($_POST['devis'])){ ...@@ -184,7 +187,16 @@ if( isset($_POST['devis'])){
} }
?> ?>
<script> <script>
autocomplete(document.getElementById("form_email"),<?php echo json_encode($tableau); ?>) var tab = <?php echo json_encode($tableau); ?>;
$('#form_email').autocomplete({
source : function( request, response ) {
var t = jQuery.grep(tab, function(a){
var patt = new RegExp("^" + request.term, "i");
return (a.match(patt));
});
response(t);
},
});
</script> </script>
</div> </div>
</div> </div>
......
...@@ -590,3 +590,5 @@ input[type='radio']:after { ...@@ -590,3 +590,5 @@ input[type='radio']:after {
html, body { height:100%; } html, body { height:100%; }
ressources/css/smoothness/images/animated-overlay.gif

1,7 ko

ressources/css/smoothness/images/ui-bg_flat_0_aaaaaa_40x100.png

212 octets

ressources/css/smoothness/images/ui-bg_flat_75_ffffff_40x100.png

208 octets

ressources/css/smoothness/images/ui-bg_glass_55_fbf9ee_1x400.png

335 octets

ressources/css/smoothness/images/ui-bg_glass_65_ffffff_1x400.png

207 octets

ressources/css/smoothness/images/ui-bg_glass_75_dadada_1x400.png

262 octets

ressources/css/smoothness/images/ui-bg_glass_75_e6e6e6_1x400.png

262 octets

ressources/css/smoothness/images/ui-bg_glass_95_fef1ec_1x400.png

332 octets

ressources/css/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png

280 octets

ressources/css/smoothness/images/ui-icons_222222_256x240.png

6,76 ko

ressources/css/smoothness/images/ui-icons_2e83ff_256x240.png

4,44 ko

ressources/css/smoothness/images/ui-icons_454545_256x240.png

6,83 ko

ressources/css/smoothness/images/ui-icons_888888_256x240.png

6,83 ko

ressources/css/smoothness/images/ui-icons_cd0a0a_256x240.png

4,44 ko

Ce diff est replié.
Ce diff est replié.
function autocomplete(inp, arr) {
/*the autocomplete function takes two arguments,
the text field element and an array of possible autocompleted values:*/
var currentFocus;
/*execute a function when someone writes in the text field:*/
inp.addEventListener("input", function(e) {
var a, b, i, val = this.value;
/*close any already open lists of autocompleted values*/
closeAllLists();
if (!val) { return false;}
currentFocus = -1;
/*create a DIV element that will contain the items (values):*/
a = document.createElement("DIV");
a.setAttribute("id", this.id + "autocomplete-list");
a.setAttribute("class", "autocomplete-items");
/*append the DIV element as a child of the autocomplete container:*/
this.parentNode.appendChild(a);
/*for each item in the array...*/
for (i = 0; i < arr.length; i++) {
/*check if the item starts with the same letters as the text field value:*/
if (arr[i].substr(0, val.length).toUpperCase() == val.toUpperCase()) {
/*create a DIV element for each matching element:*/
b = document.createElement("DIV");
b.setAttribute("class", "autocomplete-item");
/*make the matching letters bold:*/
b.innerHTML = "<strong>" + arr[i].substr(0, val.length) + "</strong>";
b.innerHTML += arr[i].substr(val.length);
/*insert a input field that will hold the current array item's value:*/
b.innerHTML += "<input type='hidden' value='" + arr[i] + "'>";
/*execute a function when someone clicks on the item value (DIV element):*/
b.addEventListener("click", function(e) {
/*insert the value for the autocomplete text field:*/
inp.value = this.getElementsByTagName("input")[0].value;
/*close the list of autocompleted values,
(or any other open lists of autocompleted values:*/
closeAllLists();
});
a.appendChild(b);
}
}
});
/*execute a function presses a key on the keyboard:*/
inp.addEventListener("keydown", function(e) {
var x = document.getElementById(this.id + "autocomplete-list");
if (x) x = x.getElementsByTagName("div");
if (e.keyCode == 40) {
/*If the arrow DOWN key is pressed,
increase the currentFocus variable:*/
currentFocus++;
/*and and make the current item more visible:*/
addActive(x);
} else if (e.keyCode == 38) { //up
/*If the arrow UP key is pressed,
decrease the currentFocus variable:*/
currentFocus--;
/*and and make the current item more visible:*/
addActive(x);
} else if (e.keyCode == 13) {
/*If the ENTER key is pressed, prevent the form from being submitted,*/
e.preventDefault();
if (currentFocus > -1) {
/*and simulate a click on the "active" item:*/
if (x) x[currentFocus].click();
}
}
});
function addActive(x) {
/*a function to classify an item as "active":*/
if (!x) return false;
/*start by removing the "active" class on all items:*/
removeActive(x);
if (currentFocus >= x.length) currentFocus = 0;
if (currentFocus < 0) currentFocus = (x.length - 1);
/*add class "autocomplete-active":*/
x[currentFocus].classList.add("autocomplete-active");
}
function removeActive(x) {
/*a function to remove the "active" class from all autocomplete items:*/
for (var i = 0; i < x.length; i++) {
x[i].classList.remove("autocomplete-active");
}
}
function closeAllLists(elmnt) {
/*close all autocomplete lists in the document,
except the one passed as an argument:*/
var x = document.getElementsByClassName("autocomplete-items");
for (var i = 0; i < x.length; i++) {
if (elmnt != x[i] && elmnt != inp) {
x[i].parentNode.removeChild(x[i]);
}
}
}
/*execute a function when someone clicks in the document:*/
document.addEventListener("click", function (e) {
closeAllLists(e.target);
});
}
\ No newline at end of file
0% Chargement en cours ou .
You are about to add 0 people to the discussion. Proceed with caution.
Veuillez vous inscrire ou vous pour commenter