11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

Comme vous pouvez vous en douter, j'ai un petit ici.

J'ai une liste générée par du php (fait par un collègue) avec chaque label, un input correspondant. Je souhaiterai tester la valeur de l'input qui est désactiver. pour être certain que ce soit bien un chiffre qui a été ajouter avant de valider le formulaire.

Code php :
Foreach($ListeSalaries as $Cle=>$Valeur)
        {
            ?>
            <br><label><?php echo($Valeur['NomSalarie'].' '.$Valeur['PrenomSalarie'].' '.$Valeur['CategorieSalaire'].' heures :</label> <INPUT type="text" name="Interv_Id='.$Valeur['IdSalarie'].'+'.$Valeur['CategorieSalaire'].'" size="10" id="TempsTravail" onblur="TestTempsTravail()">' );
 
            ?>
                <span id="ErreurTempsTravail"></span><br>
            <?php
        }


J'ai testé pas mal de trucs sur java ... et rien ne fonctionne .. :s

Si vous pouviez me donner un petit coup de main, des pistes de recherche ... Merci d'avance.
Salut
J'ai rien compris..

Donc :

Tu as une liste avec une concaténation NOM+PRENOM + une input qui contient interv_ID.
Tu souhaite tester la valeur (QUELLE VALEURS?) de l'input (QUELLE INPUT ? celui qui porte l'id TempsTravail ? Si oui, alors comment tu ne pourras pas le sélectionner par UN ID car un ID c'est unique et la tu met un ID dans une boucle, donc c'est mauvais.) qui est désactiver.. merci de détailler.
Ensuite tu veux être certain que ce soit bien un chiffre qui a été ajouter avant de valider le formulaire. Un chiffre ? ajouter ? qui ajoute ce chiffre ? la boucle ? avant validation du formulaire ? merci de détailler aussi.
Donc pour (essayer d') être un peu plus clair :

je souhaiterai tester la valeur qui a été entrée dans toutes mes input de ma boucle et valider le formulaire si ca a été rempli par un chiffre ou par rien.

J'avais l'intention de faire un getelementbyname et de commencer mes tests à partir de là. et de finir avec un onsubmit=return

Qui ajoute ce chiffre ?? l'utilisateur qui est sur la page

C'est un peu plus clair ??
Il faut que tu testes les champs après l'envoi du formulaire.

Donc dans un premier temps il faut créer un événement qui va se déclencher à l'envoi du formulaire. Si tu ne sais quoi chercher :
https://www.google.com/search?client=firefox-b-d&q=javascript+on+submit

Normalement tu ne devrais pas t'intéresser à la boucle php créée par ton collègue, seul le code html généré en front sert pour javascript.

Les formulaires ça se teste côté serveur car il est possible d'outrepasser tous les tests côté client. Javascript c'est quelque chose qui vient en plus pour améliorer l’expérience de l'utilisateur.

Tu peux faire des champs de type number :
https://www.alsacreations.com/tuto/lire/1409-formulaire-html5-type-number.html
Sachant quand même que ce n'est pas supporté partout :
https://caniuse.com/#feat=input-number

Autrement java n'a strictement rien à voir avec javascript.
Modifié par bacasable (03 Sep 2019 - 09:24)
En effet, le titre n'est pas bon, c'est bien du JS que je voudrai ... :s

Je souhaiterai surtout afficher un petit message d'erreur si la valeur n'est pas bonne, pour informer tout de suite l'utilisateur.

En ce qui concerne l'input de type nombre, je trouve que c'est moche en fait .. ces petits triangles pour augmenter ou diminuer le chiffre.

En fait, je voudrai que l'utilisateur ai un petit message suite à la désactivation de l'input avec un onblur. Et l'autorisation de l'envoi du formulaire à priori je sais faire.

Mon gros problème c'est que je ne sais pas récupérer les noms de mes inputs qui sont générées par mon php.

<input type="text" name="Interv_Id='.$Valeur['IdSalarie'].'+'.$Valeur['CategorieSalaire'].'"


Je pensais a un var NomSalarie = get.elementByName(.............) , mais je ne sais pas ni quoi ni comment mettre la suite
Je pense qu'il faut mieux utiliser les id (comme TempsTravail) vu que les valeurs de name ne sont pas fixe. D'ailleurs le code généré par ton collègue est certainement invalide car il ne peut pas y avoir 2 id identiques sur une même page. Ce qui risque fortement d'arriver dans un foreach donc il faudrait remplacer cela par une class.

Ensuite je pense que tu dois utiliser onblur (ou peut être oninput vu qu'en validant le formulaire avec la touche entrée je ne suis pas certain que ton onblur sera déclenché, à vérifier)
avec this.

Alors attention je ne suis pas expert en javascript, je fais ça avec jQuery habituellement, mais tu dois pouvoir faire quelque chose comme cela pour récupérer la valeur de ton input dans ta fonction callback :

<input type="text" oninput="dosomething(this.value)">
Note que c'est pas une bonne pratique de mettre du js directement dans le code comme cela, il faut faire ça dans un fichier à part. Smiley cligne
Bien entendu, le js a part ...

Merci pour le coup de main. J'ai réussit a progresser dans ce que je voulais.
Le PHP :
<label><?php echo($Valeur['NomSalarie'].' '.$Valeur['PrenomSalarie'].' '.$Valeur['CategorieSalaire'].' heures :</label> <INPUT type="text" name="Interv_Id='.$Valeur['IdSalarie'].'+'.$Valeur['CategorieSalaire'].'" size="10" id="TempsTravail" onblur="TestTempsTravail(this)">' );

            ?>
                <span id="ErreurTempsTravail"></span><br>


Le JS :
var TempsTravail_ok;

function TestTempsTravail(input)
{
	alert('on y est');
	if (input.value!="")
	{
		alert('pas vide')
		
		if (/[^0-9,.]/.test(input.value))
		{
			document.getElementById('ErreurTempsTravail').textContent="Format non valide.";
			document.getElementById('ErreurTempsTravail').style.color="red";
			Nom_ok = false;
			alert('format non valide')
		}
		
		else
		{
			document.getElementById('ErreurTempsTravail').textContent="Format ok.";
			document.getElementById('ErreurTempsTravail').style.color="red";
			TempsTravail_ok = true;
			alert('format valide')
		}
	}

	else
	{
		document.getElementById('ErreurTempsTravail').textContent="Format non valide.";
		document.getElementById('ErreurTempsTravail').style.color="red";
		return true;
		alert('Vide')
	}
	alert(input.value);	
}


Donc j'ai mes mouchards avec mes alertes que je retirerai après. J'ai bien mes tests et ca a l'air de fonctionner comme je souhaitais. Le seul soucis qui me reste maintenant (et vu le code actuel c'est logique) c'est que mon petit message d'erreur (<span>)s'affiche uniquement sur la première ligne.
Comment pourrais-je modifier ça pour l'afficher sur le input incriminé ??
@Thomasd38 : Donc tu as trouvé ton bonheur ??

J'essaye toujours d'afficher mon message d'erreur en face de l'élément responsable de l'erreur.
Je viens d'y penser, n'y aurait-il pas un possibilité de faire varier un nom d'id en fonction d'une variable php ??
Un truc dans ce genre :
<span>id="ErreurTempsTravail <?php Interv_Id='.$Valeur['IdSalarie'].'+'.$Valeur['CategorieSalaire'].'?>"</span>


Auquel cas, je dois pouvoir récupérer le nom de l'id sur lequel l'utilisateur a cliqué et afficher le message uniquement dans le <span> de l'id responsable.
Thomasd38 a écrit :

Heureusement que je suis tombé sur ce post car cela fait pas mal de temps que je cherche un moyen de tester une valeur.


Comment à tu fais pour me cité en rajoutant "rachat de credit travaux." avec un lien, au milieu de ce que j'ai dit ???
Modifié par JENCAL (06 Sep 2019 - 09:54)
Administrateur
C'est une technique de spam : reprise de contenu "plausible" (s'il a été écrit par quelqu'un d'autre il l'est) avec insertion du lien de spam.
Smiley ban On dit adieu à Thomasd38 Smiley coucou

EDIT: n'hésite pas à nous le signaler si tu tombes sur d'autres messages du genre. À part regarder les dernières réponses ou constater des déterrages de sujet, c'est assez difficile à détecter.
Modifié par Felipe (06 Sep 2019 - 16:20)
Felipe a écrit :
C'est une technique de spam : reprise de contenu "plausible" (s'il a été écrit par quelqu'un d'autre il l'est) avec insertion du lien de spam.
Smiley ban On dit adieu à Thomasd38 Smiley coucou

EDIT: n'hésite pas à nous le signaler si tu tombes sur d'autres messages du genre. À part regarder les dernières réponses ou constater des déterrages de sujet, c'est assez difficile à détecter.


Ah ok, ça marche, j'en vois assez régulièrement depuis 1 ou 2 mois Smiley smile