bonjour a tous

cela fait de nouveau des jours que je me bats avec mon panier en javascript
il me manque juste un détail pour la finalisation
je suis confronté a un petit soucis

Mon panier en javascript qui fonctionne très bien sur pc

Lorsque je clic dans le select le nombre d'article passe a 1 et lorsque je choisi une quantité le data-qte prends la valeur de l élément value

donc cela est correct

mais sur mon smartphone cela ne fonctionne pas correctement

Lorsque je clic dans le select le nombre d'article passe a 1 et lorsque je choisi une quantité le data-qte NE prends PAS la valeur de l élément value

je souhaiterais donc que lorsque je clic dans le select pour choisir une quantité que cela n'indique pas 1 mais prenne la valeur de l'élément value

voici un lien vers un exemple

https://phil.pecheperle.be/panier/index1.php

j'ai donc fouiller mon code pour savoir ou et comment cela se passait

j'ai donc la partie html qui permet de sélectionner le select

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
<select class="form-select btn btn-primary ajouter-panier" aria-label="2001" onchange="changeQte(this);" style="cursor:pointer;" data-nom="2001" data-prix="1.00" data-qte="1"   data-checkbox="2001"  style="padding-top: 0.375rem;  padding-right: 0rem;  padding-bottom: 0.375rem;  padding-left: 0rem; ">
	              <option selected value="0">0 sachet dans le panier </option>
				  <option value="1"> sachet dans le panier</option>
	              <option value="1">1 sachet dans le panier</option>
			<option value="2">2 sachets dans le panier</option>
	              <option value="3">3 sachets dans le panier</option>
	              <option value="4">4 sachets dans le panier</option>
	              <option value="5">5 sachets dans le panier</option>
	            	            </select>
ce qui me fait des misères c'est ce data-qte="1" que j'ai mis a data-qte="0" mais cela n a rien change

lors du clic dans le select cette fonction est appelée et donc utilise le data-qte

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
40
41
42
43
$('.ajouter-panier').click(function(event) {
	event.preventDefault(); 
 
//on mets des variables a 0
	var nom_option = "";
	var prix_option = 0;
	var option_checkbox = $(this).data('checkbox');
 
//on regarde si le checkbox est coche
	if (option_checkbox != "") 
	{
		var checkboxes = document.getElementsByClassName(option_checkbox);
			for(var i = 0; i < checkboxes.length; i++) {
				if (checkboxes[i].checked == true) {
					var nom_option = nom_option + " (" + $(checkboxes[i]).data('nom') +")";
					var prix_option = prix_option + Number($(checkboxes[i]).data('prix'));
				}
			}
	}  
 
//on regarde si le select est choisi
	if ($(this).data('select')) 
	{
		var nom = $(this).data('nom') + " (" + document.getElementById(""+$(this).data('select')+"").value + ")" + nom_option;
	}
	else var nom = $(this).data('nom');
	var prix = Number($(this).data('prix')) + (prix_option);
 
//on test la date-qte partie qui m intéresse
	if ($(this).attr('data-qte'))
	{
		var qte_option = $(this).attr('data-qte');
		MonPanier.ajouter_produit_dans_panier(nom, prix, qte_option);
	}
	else MonPanier.ajouter_produit_dans_panier(nom, prix, 1);
 
	afficherpanier();
});
 
$('.clear-panier').click(function(){
	MonPanier.clearpanier();
	afficherpanier();
});
a ce moment la console m affiche 1
je souhaiterais que ca soit l élément value qui soit pris en compte et donc n affiche rien puisque je n'ai aps encore fait de choix

ensuite je choisi la quantité avec le select value
a ce moment sur mon pc la valeur data-qte prends bien la valeur de l'element.value

par contre sur mon smartphone cela ne se passe pas

et le code est le suivant

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
function changeQte(element){
 
//on traite la variable qte
	var qte = element.value;
	var t = $(element);
	var label = t.attr("aria-label");
	let data_qte =  document.querySelector("[data-nom='"+ label +"']");
	data_qte.removeAttribute("data-qte");
	data_qte.setAttribute("data-qte", ""+qte+"");
 
 
//on affiche le pop up
   let m;
	 m = "\ Le panier compte désormais ";
	 m += "<font color='red'><strong>";
	  m += event.target.getAttribute("data-qte");
	  m += "</strong></font>";
  m += " sachet(s) de l'article \'";
  m += event.target.getAttribute("data-nom");
   //m += "\" a bien été ajouté au panier";
  function insertAfter(newNode, existingNode) {
    existingNode.parentNode.insertBefore(newNode, existingNode.nextSibling);
  }
  let e = document.createElement('div');
  let s = "";
  e.classList.add("maJolieAlert");
  s += '<div><p>' + m + '</p>';
  s += '<button type="button" onclick="fermeMaJolieAlert(event)">OK</button></div>';
  e.innerHTML = s;
  insertAfter(e, event.target);
}
 
	function fermeMaJolieAlert(event) {
  event.target.parentNode.parentNode.remove();
}