Page 1 sur 1

Incrémenter un bouton en JS

Posté : 29 août 2022, 15:22
par wisefun77
Bonjour,
J'ai ce code pour afficher autant de données qu'il y a dans un tableau.

Code : Tout sélectionner

<?php // Set session variables setlocale(LC_TIME, 'fra_fra'); $timezone = +2; //(GMT +2:00) EST (F.R. & PARIS) $date = '['.gmdate("j/m/Y H:i:s", time() + 3600*($timezone+date("I"))).']'; $version = "[Version_2.02]"; $code= "[ADC_END]"; // Traitement du code pour le checksum. $chaine = $_SESSION['Start']; //le checksum ressemble à un CRC32. //En php il suffit d'appeler la fonction crc32 : $checksum = crc32($chaine); // Cela génère un entier. // Représentation héxadécimal:faire un dechex : $str = dechex($checksum); $_SESSION['END'] ='['.$str.']'.$date.$version.$code; $_SESSION["Balises3"] = $_SESSION['Balises3'].$_POST['balise']; if(isset ($_SESSION['TabInter'])){ for($ligne=0;$ligne<sizeof($_SESSION['TabInter']);$ligne++) { $_SESSION['ValueInter']= $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code; ?> <table align="center"> <tr align="center"> <td> <form id="form-copier" > <!-- //champ de saisie de texte --> <textarea class="js-inter" id="inter" cols="80" rows="5"disabled="disabled"><?php print_r($_SESSION['ValueInter']) ?></textarea> <!-- //Bouton copier --> <input type="button" class="js-copybtn" value="Copier la chaîne" onclick="this.disabled = 'disabled';this.type='checkbox';this.checked='checked'"> </form> </td> </tr> </table> <script> (() => { const button = document.querySelector('.js-copybtn'); button.addEventListener("click", () => { const elemText = document.getElementById("inter"); // supprimer l'attribut disabled si existe const disabled = elemText.getAttribute("disabled"); elemText.removeAttribute("disabled"); // selectionne le contenu elemText.focus(); elemText.select(); // copy document.execCommand("copy"); // réactive l'attribut disabled si existe disabled && elemText.setAttribute("disabled", disabled); // remise focus sur Btn button.focus(); try { if (document.execCommand('copy')) { var alerte="Champs Work Notes* " alert('La chaine des Balises a été copié ! \n\r Il suffit de la coller dans le ' + alerte + 'de ServiceNow.'); //document.location.replace('pagefin.php'); } } catch (err) { alert('Pas possible de copier.'); } window.getSelection().removeAllRanges(); }); })(); </script> <?PHP } } ?>
Cela affiche bien autant de textarea qu'il faut avec les bonnes infos.
MAIS:
Le code pour copier la textarea suivant son bouton doit changer d'ID.
Je ne sais pas comment faire pour changer l'Id à chaque construction de texaera par la boucle for.

Merci.

Re: Incrémenter un bouton en JS

Posté : 29 août 2022, 15:33
par Spols
met un id via php à ton textarea et quasi le même à ton bouton
genre tx-inter-## et inter-##
## est un nombre incrémenté à chaque boucle
et en javascript en récupérant l'id du bouton (grâce à this), ajoute tx- devant et tu connais l'id du textarea

Re: Incrémenter un bouton en JS

Posté : 29 août 2022, 16:04
par wisefun77
Bonjour Spols,
J'ai fait ce code, mais je doute de moi.
if(isset ($_SESSION['TabInter'])){
	$txtInter=0;
	$btnInter=0;
	$jsInter=0;
	for($ligne=0;$ligne<sizeof($_SESSION['TabInter']);$ligne++)
	{
		$_SESSION['ValueInter']= $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code;
		// echo $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code;
		//echo $_SESSION['ValueInter']."<br/><br/>";
	?>
		<table align="center">
    <tr align="center">
        <td>
        <form id="form-copier" >
        <!-- //champ de saisie de texte -->
        <textarea id=.$txtInter++  cols="80" rows="3"disabled="disabled"><?php print_r($_SESSION['ValueInter']) ?></textarea>
        <!-- //Bouton copier -->
        <input type="button" class=.$jsInter++ id=.btnInter++  value="Copier la chaîne" onclick="this.disabled = 'disabled';this.type='checkbox';this.checked='checked'">
    </form>
        </td>
    </tr>
</table>
<?PHP
print_r($btnInter);
?>
Pourquoi le bouton ne s'incrémente t-il pas ?
Merci.

Re: Incrémenter un bouton en JS

Posté : 30 août 2022, 08:25
par Spols
regarde le code source généré,
$txtInter++ et autre ne sont pas dans des balise php avec echo du coup il apparaisse brut.
ton code html ne doit pas être valide, tes attribut doivent être dans des ""
je te déconseille des id avec juste un chiffre, met un prefix devant.

utilise ta variable $ligne elle s'incrémente dans ta boucle

Re: Incrémenter un bouton en JS

Posté : 30 août 2022, 11:41
par wisefun77
Bonjour Spols,
J'ai modifié le code , mais c'est le même résultat.

Code : Tout sélectionner

<?PHP if(isset ($_SESSION['TabInter'])){ for($ligne=0;$ligne<sizeof($_SESSION['TabInter']);$ligne++) { $txt_0=0; $btn_0=0; $js0=0; $_SESSION['ValueInter']= $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code; ?> <table align="center"> <tr align="center"> <td> <form id="form-copier" > <!-- //champ de saisie de texte --> <textarea id="<?php $txt_0.$ligne; ?>" cols="80" rows="3"disabled="disabled"><?php print_r($_SESSION['ValueInter']) ?></textarea> <!-- //Bouton copier --> <input type="button" class="<?php $js0.$ligne; ?>" id="<?php $btn_0.$ligne; ?>" value="Copier la chaîne" onclick="this.disabled = 'disabled';this.type='checkbox';this.checked='checked'"> </form> </td> </tr> </table> <?PHP print_r($txt_0); ?>
L'id affiche 0.

Merci pour ta patience.

Re: Incrémenter un bouton en JS

Posté : 30 août 2022, 12:20
par wisefun77
Bonjour Spols,
J'ai trouvé la solution.

Code : Tout sélectionner

if(isset ($_SESSION['TabInter'])){ for($ligne=0;$ligne<sizeof($_SESSION['TabInter']);$ligne++) { $txt_0=0; $btn_0=0; $js_0=0; $_SESSION['ValueInter']= $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code; $txt_0 = $ligne; $btn_0 = $ligne; $js_0 = $ligne; ?> <table align="center"> <tr align="center"> <td> <form id="form-copier" > <!-- //champ de saisie de texte --> <textarea id="<?php $txt_0; ?>" cols="80" rows="3"disabled="disabled"><?php print_r($_SESSION['ValueInter']) ?></textarea> <!-- //Bouton copier --> <input type="button" class="<?php $js_0; ?>" id="<?php $btn_0; ?>" value="Copier la chaîne" onclick="this.disabled = 'disabled';this.type='checkbox';this.checked='checked'"> </form> </td> </tr> </table> <?PHP print_r($txt_0); print_r($btn_0); print_r($js_0); ?>
Maintenant comment appeler les variables PHP dans le JS ?
Merci.

Re: Incrémenter un bouton en JS

Posté : 30 août 2022, 13:43
par Spols
Mois je verrai plutot les choses comme ceci

Code : Tout sélectionner

if(isset ($_SESSION['TabInter'])){ for($ligne=0;$ligne<sizeof($_SESSION['TabInter']);$ligne++) { $_SESSION['ValueInter']= $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code; ?> <table align="center"> <tr align="center"> <td> <form id="form-copier" > <!-- //champ de saisie de texte --> <textarea id="<?php print_r('tx-'.$ligne); ?>" cols="80" rows="3"disabled="disabled"><?php print_r($_SESSION['ValueInter']) ?></textarea> <!-- //Bouton copier --> <input type="button" class="<?php print_r('bt-'.$ligne) ?>" id="<?php print_r('bt-'.$ligne) ?>" value="Copier la chaîne" onclick="this.disabled = 'disabled';this.type='checkbox';this.checked='checked'"> </form> </td> </tr> </table>
regarde le code html que cela produit et adapte ton javascript

Re: Incrémenter un bouton en JS

Posté : 30 août 2022, 14:45
par wisefun77
Bonjour Spols,
J'avais pensé à mettre print_r, mais je croyais que cela allait s'afficher dans la textarea.
J'aurais du tester avant de supposer.
J'ai ajouté ton code et maintenant je vais essayer de l'adapter au JS.
Merci pour ta patience.

Re: Incrémenter un bouton en JS

Posté : 30 août 2022, 15:09
par wisefun77
Bonjour Spols,
J'ai trouvé.

Code : Tout sélectionner

if(isset ($_SESSION['TabInter'])){ for($ligne=0;$ligne<sizeof($_SESSION['TabInter']);$ligne++) { $_SESSION['ValueInter']= $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code; ?> <table align="center"> <tr align="center"> <td> <form id="form-copier" > <!-- //champ de saisie de texte --> <textarea id="<?php print_r('tx-'.$ligne); ?>" cols="80" rows="3"disabled="disabled"><?php print_r($_SESSION['ValueInter']) ?></textarea> <!-- //Bouton copier --> <input type="button" class="<?php print_r('bt-'.$ligne) ?>" value="Copier la chaîne" onclick="this.disabled = 'disabled';this.type='checkbox';this.checked='checked'"> </form> </td> </tr> </table> <?PHP ?> <!-- Script bouton --> <script> (() => { const button = document.querySelector('.<?php print_r('bt-'.$ligne) ?>'); button.addEventListener("click", () => { const elemText = document.getElementById("<?php print_r('tx-'.$ligne); ?>"); // supprimer l'attribut disabled si existe const disabled = elemText.getAttribute("disabled"); elemText.removeAttribute("disabled"); // selectionne le contenu elemText.focus(); elemText.select(); // copy document.execCommand("copy"); // réactive l'attribut disabled si existe disabled && elemText.setAttribute("disabled", disabled); // remise focus sur Btn button.focus(); try { if (document.execCommand('copy')) { var alerte = "Champs Work Notes* " alert('La chaine des Balises a été copié ! \n\r Il suffit de la coller dans le ' + alerte + 'de ServiceNow.'); } } catch (err) { alert('Pas possible de copier.'); } window.getSelection().removeAllRanges(); }); })(); </script>
Grace à toi.
Merci pour ton aide et ton savoir.

Re: Incrémenter un bouton en JS

Posté : 30 août 2022, 15:40
par Spols
C'est pas mal et tant mieux si ça marche, mais si tu a 10 000 text area tu aura 10 000 function JS qui fait la même chose ton fichier sera gros inutilement

Que dirais tu d'un code comme celui ci

Code : Tout sélectionner

if(isset ($_SESSION['TabInter'])){ for($ligne=0;$ligne<sizeof($_SESSION['TabInter']);$ligne++) { $_SESSION['ValueInter']= $_SESSION['Start'].$_SESSION['TabInter'][$ligne].$_SESSION['Balises3'].$_SESSION['Balises4'].'['.$str.']'.$date.$version.$code; ?> <table align="center"> <tr align="center"> <td> <form id="form-copier" > <!-- //champ de saisie de texte --> <textarea id="<?php print_r('tx-'.$ligne); ?>" cols="80" rows="3"disabled="disabled"><?php print_r($_SESSION['ValueInter']) ?></textarea> <!-- //Bouton copier --> <input type="button" class="clipboard" id="<?php print_r('bt-'.$ligne) ?>" value="Copier la chaîne" onclick="this.disabled = 'disabled';this.type='checkbox';this.checked='checked'"> </form> </td> </tr> </table> <?PHP } //Ici c'est la fin de la boucle for en php ?> <!-- Script bouton --> <script> (() => { const button = document.querySelector('.clipboard'); button.addEventListener("click", () => { idTextArea = 'tx-' + this.id.substr(3,this.id.length); const elemText = document.getElementById(idTextArea); // supprimer l'attribut disabled si existe const disabled = elemText.getAttribute("disabled"); elemText.removeAttribute("disabled"); // selectionne le contenu elemText.focus(); elemText.select(); // copy document.execCommand("copy"); // réactive l'attribut disabled si existe disabled && elemText.setAttribute("disabled", disabled); // remise focus sur Btn button.focus(); try { if (document.execCommand('copy')) { var alerte = "Champs Work Notes* " alert('La chaine des Balises a été copié ! \n\r Il suffit de la coller dans le ' + alerte + 'de ServiceNow.'); } } catch (err) { alert('Pas possible de copier.'); } window.getSelection().removeAllRanges(); }); })(); </script>
j'ai pas testé mais le code généré est bien plus court

Re: [RESOLU] Incrémenter un bouton en JS

Posté : 01 sept. 2022, 11:51
par wisefun77
Bonjour Spols,
Merci pour ton code.
Je viens de le tester, mais la partie du cheksum, ne s'incrémente pas.
Par contre je garde ton code car très utile pour les autres functions copier que j'ai dans l'application.
Merci beaucoup pour tout.