Discussion :

[ddaweb]

Bonsoir à tous,

Je me casse les dents sur un champs d'autocomplétion en JQuery (cherche du nom du membre avec son N°) qui fonctionne très bien quand l'input est introduite avec un clavier, mais pas lorsque que c'est via un clavier tactile en JS.

D'abord un petit screen de la page concernée où j'ai introduit le n° membre via le tactile, pour lequel je doit faire autocomplétion (c'est une caisse bar en web, avec ouverture du tiroir pour les paiements cash) :



NB : mon Wamp local ne gère pas l'UTF-8, je dois encore chercher pourquoi, voir le réinstaller

J'ai réussi à sauver cette valeur en COOKIE et SESSION via JS dans le code du clavier tactile -> je les retrouve bien dans la console et se met à jour avec le tactile :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
	<script type='text/javascript'>
	function nrMbr() {
		var nr_mbr = activeinput.value
		sessionStorage.setItem("nr_mbr", nr_mbr)
		document.cookie = "nr_mbr = " + nr_mbr;
	}
 
	var activeinput
 
	function populateTd(){
		var tdcollection=document.getElementsByTagName('table')[0].getElementsByTagName('td')
		for (i=0;i<tdcollection.length;i++){
			tdcollection[i].indice=i
			tdcollection[i].onmouseover=function(){this.className='over'}
			tdcollection[i].onmouseout=function(){this.className='up'}
			tdcollection[i].className='up'
			tdcollection[i].onmousedown=function(){this.className='down'}
			tdcollection[i].onmouseup=function(){this.className='up'}
 
			tdcollection[i].onclick=function(){
				if (!!activeinput){
					if(this.indice<11){activeinput.value+=this.innerHTML;}
					if(this.indice==11){activeinput.value=activeinput.value.substr(0,activeinput.value.length-1)}
					if(this.indice==12){activeinput.value=""}
					JouerSon()
					nrMbr()
				}
			}
		}
	}
 
	function highlightActive(obj){
		var inputcollection=document.getElementsByTagName('input')
		for(i=0;i<inputcollection.length;i++){
 
			inputcollection[i].style.backgroundColor=(inputcollection[i]==obj)?"lime":"white"
		}
	}
	</script>

Mais la recherche d'autocomplétion ne s'active pas !!
Activation de l'autocomplétion :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<script>
	$(function() {
		$("#note_mbr").autocomplete({
			source: "./pages/div4/autocompletion/auto_membre_id.php",
			minLength: 1,
		});
	});
</script>

Recherche dans DB

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// ----- Récupération des caractères introduits 
//$searchTerm = $_GET['term']; // ----- Via clavier
 
$searchTerm = $_COOKIE ['nr_mbr'];  // ----- Via tactile
 
// ----- Recherche en fonction des caractères introduits
$query = $conn_cecs->query("SELECT p_prenom, p_nom, p_reinscription FROM 02_prop WHERE id_prop='$searchTerm'"); 
 
// ----- Génération du ARRAY des données affichées
$array_id=array();
$date_jour2=date('Y-m-d');
 
if($query->num_rows > 0){ 
    while($row = $query->fetch_assoc()){ 
		$cot=$row['p_reinscription'];
		$cot_fin=date ('Y-m-d',strtotime('+ 1 year + 21 days',strtotime($cot)));
		if ($cot_fin>$date_jour2) { $data['value'] = $row['p_prenom'].' '.$row['p_nom']; }
		else { $data['value'] = 'Ne peut plus avoir de compte'; }
        array_push($array_id, $data); 
    } 
} 
 
// ----- Traiter le ARRAY en données json
echo json_encode($array_id);

Le code du formulaire pour le N° de membre, l'ID sert pour l'autocomplétion et onfocus pour le tactile :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
/ -------------------- Note de bar membre
if ($mode=='Caisse' || ($mode=='Liste_compte' && !isset($_SESSION['pas_de_compte'])) || ($mode=='Liste_cash' && !isset($_SESSION['pas_de_compte']) && $cours_jour_cloture=='non')) {
	print "<div style=\"float: left; width: 50%;\" align=\"center\">";
		if ($prix_commande>0) {
			if ($activite_membre=='oui' && $mode=='Caisse') { $value_note_mbr=14; }
				else { $value_note_mbr=''; }
			print "<form name=\"note_mbr\" method=\"post\" action=\"?Compte_membre\">";
				print "<input type=\"text\" name=\"note_mbr\" value=\"$value_note_mbr\"  id=\"note_mbr\" style=\"width: 70px; height: 40px; font-size: 16px; font-weight: bold; color:#fff; text-align: center; letter-spacing: 2px; background-color: #7093FE  ; border: 1px solid #1f618d ; border-radius: 6px;\" onfocus=\"activeinput=this\" onclick=\"JouerSon()\" />&nbsp;&nbsp;&nbsp;";
				print "<input type=\"submit\" class=\"submit_note_mbr\" value=\"&nbsp;\" onclick=\"JouerSon()\" />";
			print "</form>";
		}
	print "</div>";

Si quelqu'un a une idée comment transmettre l'information du N° membre à l'autocomplétion lorsque c'est le tactile qui travaille, je suis dessus depuis 3 jours sans succès.
J'espère avoir été compréhensible dans mes explications et que les codes vous permettrons de comprendre

D'avance merci pour votre aide,
DDAWEB

EDIT : le clavier est un tableau avec TR - TD mit en page via CSS

Un screen de l'autocomplétion via clavier (un membre ne pouvant plus avoir de compte pour préserver l’anonymat des membres)