Salut à tous,

Voilà je cherche désespérément une solution à mon problème.

Je possède un liste de bouton de type checkbox dont un checkbox qui porte la valeur "autres".

Si le checkbox "autres" est coché on affiche un textarea dans une div via innerHTML.

Jusque là tout vas bien j'arrive à afficher le textarea sans soucis.

Le problème vient alors si je décocher la case checkbox pour retirer le textarea, je ne sais pas comment faire

Voici mon code javascript:

<script type="text/Javascript" language="Javascript">
function ajoutAccessoire(id)
{
   document.getElementById('divajout'+id).innerHTML = '<textarea>Ajouter les accessoires ici (1 par ligne)</textarea>';
}
</script>

Voici maintenant mon code HTML: (enfin plus en php puisque l'affichage se fait dans une boucle PHP)

<?php
	echo 'Autres: <input type="checkbox" name="'.$object_cat->id_eqq.'[]" id="'.$object_cat->id_eqq.'[]" value="ajout" onmousedown="javascript:ajoutAccessoire(\''.$object_cat->id_eqq.'\');"/>';
?>

La variable $object_cat->id_eqq contient l'id de la liste des boutons de checkbox car il y a plusieurs "catégories" contenant une liste de bouton checkbox

Je vous remercie d'avance pour votre aide

Mets le HTML généré plutôt que le PHP stp.

(Ou une partie tout du moins, si la boucle est longue)

Salut,

Désolé pour le temps de réponse voici donc le code PHP entier:

<?php
  // ON récupère le nom et l'id de la catégorie
  $sql_cat = mysql_query('SELECT * FROM `ch_cat_eqq` ORDER BY id_eqq ASC');
  while($object_cat = mysql_fetch_object($sql_cat))
  {
  	echo '<tr>';
  	// On affiche le titre de la catégorie
  	echo '<td><b>'.$object_cat->type_fr_eqq.'</b></td>';
  	echo '<td>';
  	// On effectue une requête a partir de l'id de la catégorie pour récupérer tout les accessoires
  	$sql_eqq = mysql_query('SELECT * FROM `ch_liste_eqq` WHERE id_cat = '.$object_cat->id_eqq.'');
  	while($object_eqq = mysql_fetch_object($sql_eqq))
  	{
  		// On affiche les accessoires via des checkbox
  		echo ''.$object_eqq->name_fr_liste.'<input type="checkbox" name="'.$object_cat->id_eqq.'[]" id="'.$object_cat->id_eqq.'[]" value="'.$object_eqq->id_liste.'" />';
  		
  	}
  	// On affiche une checkbox "autres" pour permettre à notre utilisateurs d'ajouter d'autres accessoire via un textarea
  	echo 'Autres: <input type="checkbox" name="'.$object_cat->id_eqq.'[]" id="'.$object_cat->id_eqq.'[]" value="ajout" onmousedown="javascript:ajoutAccessoire(\''.$object_cat->id_eqq.'\');"/>';
  	echo '<div id="divajout'.$object_cat->id_eqq.'"></div>';
  	echo '</td>';
  	echo '<tr>';
  }
  ?>

C'est un code de test pour le moment c'est pour ça qu'il y a 1 boucle dans une boucle, je vais récupéré le tout via une jointure sql par la suite si j'arrive à résoudre ce problème de checkbox

Il a demandé le code généré... STP ! (beaucoup plus simple pour chercher) tu peux le trouver en affichant le code source de la page...

Ah d'accord, excusez moi

Donc voici le code généré (avec une seule catégorie ça fait un code plus léger)

<b>Extérieur</b></td><td>Simple essieu<input type="checkbox" name="1[]" id="1[]" value="2" />Double essieu<input type="checkbox" name="1[]" id="1[]" value="3" />Autres: <input type="checkbox" name="1[]" id="1[]" value="ajout" onmousedown="javascript:ajoutAccessoire('1');"/><div id="divajout1"></div>

Cordialement

Alors alors... Tout d'abord, je pense qu'onclick() est plus adapté qu'onmousedown()...

Ensuite, pour ton problème, il va te falloir une fonction qui puisse "switcher" l'affichage du textarea en modifiant le innerHTML du div...
Pour cela, il faudra vérifier si la case est coché ou pas.

Voici donc ce que je te propose :

<b>Extérieur</b></td>
<td>Simple essieu
<input type="checkbox" name="1[]" id="1[]" value="2" />
Double essieu
<input type="checkbox" name="1[]" id="1[]" value="3" />
Autres: <input type="checkbox" name="1[]" id="1[]" value="ajout" onclick="ajoutAccessoire('1',this.checked);"/>
<div id="divajout1"></div>

J'ai enlevé le "javascript:" qui ne sert à rien et j'ai passé en deuxième paramètre à la fonction l'état de la case à cocher.

Donc ta fonction pourrait être :

function ajoutAccessoire(id,coche)
{
  if(coche) { // Si la case est cochée, on affiche le textarea
    document.getElementById('divajout'+id).innerHTML = '<textarea>Ajouter les accessoires ici (1 par ligne)</textarea>';
  }else{ // sinon, on l'enlève...
    document.getElementById('divajout'+id).innerHTML = "";
  }
}

Merci beaucoup Golmote ça fonctionne à merveille.

J'avais essayer de vérifier si la case était coché mais pas de la même manière que tu le fais moi j'avais fais:

if(document.annonce.1[].checked)
{
// On affiche le textarea
}
else
{
// On vide la div du textarea
}

Mais ça n'avait pas fonctionner.

Je ne savais pas qu'on pouvait faire un this.checked je me coucherais moins bête ce soir

Dans un onclick, this fait référence à l'élément cliqué. Ca évite de se casser la tête à l'appeler depuis document .

Ensuite, la syntaxe document.form.element ... est un peu désuète.
Tu devrais t'habituer à utiliser plutôt le DOM avec les ID, les name, les classnames, les noeuds, etc.

Salut,

Oui c'est pas faux pour la syntaxe surtout quand ce sont des gros formulaires à traiter il va falloir que je me mette à coder ça autrement pour gagner du temps au développement et certainement à l'exécution du script aussi.

Sinon pour this.value je savais qu'on pouvait le faire pour des champs de type text mais par pour des checkbox. J'ai pas l'habitude d'utiliser des checkbox avec le javascript

En tout cas encore merci à toi