Faire disparaitre les sous-catégories dont la catégorie n'est pas act

Bonjour,

Voila je suis entrain de faire un formulaire

dans ce formulaire il y a des catégories (une dizaine)

et chaque catégorie a des sous catégorie

je voudrais arrivé a faire disparaitre les autre sous catégorie et laisser que la sous catégorie en rapport avec ma catégorie active pour une facilité de lecture du formulaire et pour évité les erreurs de sous catégorie


Mais mon problème c'est que je n'arrive pas a faire disparaitre les autre sous catégorie pourriez vous m’aidez s'il vous plais ?
je m'en sort vraiment pas et que je ne trouve rien sur google je ne trouve que des histoires de menu et sous menu mais pas qui disparaisse

je débute en programmation et je ne sais même pas quel langage utiliser pour le menu (java - PHP )



ex:

(champ 1)Catégorie:
Viande
Poisson
legume




(champ 2)SS Catégorie:
Viande:
poulet
porc
etc



poisson:
rouget
sole
mérou
etc




légume:
carotte
courgette

Bonjour.

Tu souhaites faire un menu ou un formulaire ?

Tu aurais un peu de code à nous montrer pour que l'on puisse t'aider ?

bonjour,

je souhaite faire un formulaire

voila ce que j'ai fait

Formulaire

Mais ca fait un formulaire sur 2 pages j'aurais voulu que toutes les sous catégorie disparaisse et que la bonne sous catégorie apparaisse que quand j'ai sélectionné ca catégorie

[code=javascript]
	<script>
		function showmenu(menu) {
		if (menu.style.display == 'none') menu.style.display = 'block';
		else menu.style.display = 'none';
		}
	</script>

<?php

include 'connection_à_ma_BDD';

include_once("fckeditor/fckeditor.php") ;


if( isset($_POST["maj"])){

$Titre=$_POST["Titre"];
$SSTitre=$_POST["SSTitre"];
$Articles=$_POST["FCKeditor1"];
$CatParent=$_POST["CatParent"];
$CatEnfant=$_POST["CatEnfant"];
$Date=$_POST["Date"];



$reponse = mysql_query("INSERT INTO C-Astuces_Articles VALUES('', '$Titre', '$SSTitre', '$Articles', '$CatParent', '$CatEnfant', '$Date')");



}

else {


?>

   <p>Catégorie Parent:<br/>
<select type="circle" name="CatParent">
	<option>Rachat de crédit </option>
	<option>Prêt à la consommation </option>
	<option>Prêt immobilier </option>
	<option>Loi </option>
	<option>La défiscalisation </option>
	<option>Gérer son budget </option>
	<option>Assurances </option>
	<option>Epargne </option>
	<option>Simulation </option>
	<option>Définition </option>
</select>
   </p>
 
   <p>Catégorie Enfant:<br/>
    <ul type="square">
	<a onclick="javascript: showmenu(document.getElementById('sousmenu1'));"
style="cursor: pointer;"><li>Rachat de crédit <br /></a>
	
		<select name="CatEnfant" type="circle" id="sousmenu1" style="display: none;" >
			<option>Rachat de crédit consommation</option>
			<option>Rachat de crédit immobilier</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu2'));"
style="cursor: pointer;"><li>Prêt à la consommation <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu2" style="display: none;">
			<option>Prêt personnel</option>
			<option>Crédit travaux</option>
			<option>Prêt auto</option>
			<option>Prêt moto</option>
			<option>Prêt loisirs</option>
			<option>Crédit renouvelable</option>
			<option>Crédit entre particuliers (plateforme) </option>
			<option>Le surendettement en France</option>
			<option>La règlementation</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu3'));"
style="cursor: pointer;"><li>Prêt immobilier  <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu3" style="display: none;">
			<option>Définition</option>
			<option>Caractéristiques.</option>
			<option>Prêt à taux 0</option>
			<option>Frais de notaire</option>
			<option>Taux</option>
			<option>Garanties</option>
			<option>Frais</option>
			<option>Assurances</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu4'));"
style="cursor: pointer;"><li>Loi  <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu4" style="display: none;">
			<option>Loi à la consommation</option>
			<option>Loi immobilier</option>
			<option>Général</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu5'));"
style="cursor: pointer;"><li>La défiscalisation <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu5" style="display: none;">
			<option>Astuces pour défiscaliser</option>
			<option>Loi</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu6'));"
style="cursor: pointer;"><li>Gérer son budget <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu6" style="display: none;">
			<option>Comparatif des banques avec leurs frais</option>
			<option>Astuces pour faire des économies au quotidien</option>
			<option>Loyer</option>
			<option>Mandat Sepa</option>
			<option>Changer de vie</option>
			<option>Biens de consommation </option>
			<option>Passer sa retraite à l’étranger</option>
			<option>Finance d’une famille</option>
			<option>Modèle de lettre</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu7'));"
style="cursor: pointer;"><li>Assurances <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu7" style="display: none;">
			<option>Assurances emprunteur</option>
			<option>Délégation d’assurances emprunteur</option>
			<option>Prévoyances</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu8'));"
style="cursor: pointer;"><li>Epargne <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu8" style="display: none;">
			<option>Assurance vie</option>
			<option>Compte épargne</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu9'));"
style="cursor: pointer;"><li>Simulation <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu9" style="display: none;">
			<option>Prêt immobilier</option>
			<option>Rachat de crédit</option>
		</select>
	</li>
</ul>

<ul type="square">
<a onclick="javascript: showmenu(document.getElementById('sousmenu10'));"
style="cursor: pointer;"><li>Définition <br /></a>
		<select type="circle" name="CatEnfant" id="sousmenu10" style="display: none;">
			<option>Vocabulaire </option>
		</select>
	</li>
</ul>
   </p>
      <p>Titre:<br/>
    <input name="Titre" size="22" value="" type="text"/>
   </p>
         <p>Sous Titre:<br/>
    <input name="SSTitre" size="22" value="" type="text"/>
   </p>
  <p>Article :<br /><input type="hidden" name="maj" value="ok">

<?php

$oFCKeditor = new FCKeditor('FCKeditor1') ;

$oFCKeditor->BasePath = 'fckeditor/' ;

$oFCKeditor->Value = '' ;

$oFCKeditor->Create() ;

?>

<p>Date: (YYYY-MM-DD) <input name="Date" type="text" size="28" /></p>
   <input name="Valider" value="Valider" type="submit"/>
   <input name="Effacer" value="Effacer" type="reset"/>
 
</form>

<?php } ?>

[/code]

Si j'ai bien compris, en fait tu souhaites que lorsque tu changes la valeur de ton <select> "CatParent", cela fait apparaître uniquement le <select> "CatEnfant" correspondant (et faire disparaître les autres), est-ce bien ça ?

Oui !

tu le dit mieux que moi

tu a tous compris

Bonjour.

Bon, comme tu l'auras peut-être deviné, ce sera du Javascript ton bout de code qui fera ça.
En utilisant l'event onchange (ou change en jQuery) sur ton <select> parent.

si tu le dit je te croix lol

mais pour moi ça reviens au même que si tu m'avais parler en chinois je débute en css js php

Ok.

Bon le plus simple (selon moi) est d'utiliser jQuery, je ne vais pas t'expliquer ce que c'est, Google est ton ami.

Il faut ensuite que tu rajoutes des attributs value à tes <option>, cela dépendra de ce que tu veux récupérer dans ton formulaire (c'est donc à toi de voir)

Petit exemple :

<select type="circle" name="CatParent">
	<option value="rachatCredit">Rachat de crédit</option>
	<option value="pretConso">Prêt à la consommation</option>
	<option value="pretImmo">Prêt immobilier</option>
	...
</select>

<select name="CatEnfant" type="circle" id="rachatCredit" class="ssCat">
	<option>Rachat de crédit consommation</option>
	<option>Rachat de crédit immobilier</option>
</select>
<select type="circle" name="CatEnfant" id="pretConso" class="ssCat">
	...
</select>
....

Avec le CSS qui va bien :

.ssCat {
	display:none;
}

Ensuite ton script :

$('#CatParent').change(function(){
	var ssCat = $(this).children('option:selected').val()

	$('.ssCat').hide()
	$('#'+ssCat).show()
})

Ce qui donne un truc du style : http://codepen.io/anon/pen/Cmjiw

voila ce que j'ai fais je me suis basée sur tes infos

mais quand chez toi ca fonctionne chez moi il y a un os

dans mon header

<script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
   
   
	(function($){  
	  
	  $('#'+$('#CatParent option:selected').val()).show()
	  
	  $('#CatParent').change(function(){
		var ssCat = $(this).children('option:selected').val()

		$('.ssCat').hide()
		$('#'+ssCat).show()
	  })

	})(jQuery)
   </script>

<style>
.ssCat {
  display: none;
}
</style>

dans ma partie Body

   <p>Catégorie Parent: </p>
<select name="CatParent" id="CatParent">
	<option value="rachatCredit">Rachat de crédit </option>
	<option value="pretConso">Prêt à la consommation </option>
	<option value="pretImmo">Prêt immobilier </option>
	<option value="loi">Loi </option>
	<option value="defisc">La défiscalisation </option>
	<option value="gerer">Gérer son budget </option>
	<option value="assurances">Assurances </option>
	<option value="epargne">Epargne </option>
	<option value="simulation">Simulation </option>
	<option value="definition">Définition </option>
</select>

 <br/>


   <p>Catégorie Enfant:</P>
    
			 <select name="CatEnfant" id="rachatCredit" class="ssCat">
				<option>Rachat de crédit consommation</option>
				<option>Rachat de crédit immobilier</option>
			</select>



			<select name="CatEnfant" id="pretConso" class="ssCat">
				<option>Prêt personnel</option>
				<option>Crédit travaux</option>
				<option>Prêt auto</option>
				<option>Prêt moto</option>
				<option>Prêt loisirs</option>
				<option>Crédit renouvelable</option>
				<option>Crédit entre particuliers (plateforme) </option>
				<option>Le surendettement en France</option>
				<option>La règlementation</option>
			</select>



			<select name="CatEnfant" id="pretImmo" class="ssCat">
				<option>Définition</option>
				<option>Caractéristiques.</option>
				<option>Prêt à taux 0</option>
				<option>Frais de notaire</option>
				<option>Taux</option>
				<option>Garanties</option>
				<option>Frais</option>
				<option>Assurances</option>
			</select>

			<select name="CatEnfant" id="loi" class="ssCat">
				<option>Loi à la consommation</option>
				<option>Loi immobilier</option>
				<option>Général</option>
			</select>

			<select name="CatEnfant" id="defisc" class="ssCat">
				<option>Astuces pour défiscaliser</option>
				<option>Loi</option>
			</select>

			<select name="CatEnfant" id="gerer" class="ssCat">
				<option>Comparatif des banques avec leurs frais</option>
				<option>Astuces pour faire des économies au quotidien</option>
				<option>Loyer</option>
				<option>Mandat Sepa</option>
				<option>Changer de vie</option>
				<option>Biens de consommation </option>
				<option>Passer sa retraite à l’étranger</option>
				<option>Finance d’une famille</option>
				<option>Modèle de lettre</option>
			</select>

			<select name="CatEnfant" id="assurances" class="ssCat">
				<option>Assurances emprunteur</option>
				<option>Délégation d’assurances emprunteur</option>
				<option>Prévoyances</option>
			</select>

			<select name="CatEnfant" id="epargne" class="ssCat">
				<option>Assurance vie</option>
				<option>Compte épargne</option>
			</select>

			<select name="CatEnfant" id="simulation" class="ssCat">
				<option>Prêt immobilier</option>
				<option>Rachat de crédit</option>
			</select>

			<select name="CatEnfant" id="definition" class="ssCat">
				<option>Vocabulaire </option>
			</select>

mais voila le resultat :
Formulaire

Tu as une erreur JS sur ta page (dans ton docs.js).

Pour y voir un peu plus clair, tu devrais :
- rassembler au maximum tes JS dans un seul JS
- au mieux les appeler à la fin de ton body (avant la balise de fermeture)
- et sur la partie précise qui nous intéresse, déclencher ton bout de code quand ta page est entièrement chargée.

i.e.

(function($){
  $(window).load(function() {
    $( "#datepicker" ).datepicker()

    $('#'+$('#CatParent option:selected').val()).show()
	  
    $('#CatParent').change(function(){
      var ssCat = $(this).children('option:selected').val()

      $('.ssCat').hide()
        $('#'+ssCat).show()
      })
  })
})(jQuery)

super mon formulaire fonctionne presque

je remplie mon formulaire

quand je regarde en BDD le champs CatEnfant est toujours le même "Vocabulaire"

même si il apparais pas dans les options de la catégorie enfant

il prend bien en compte CatParent mais pas CatEnfant il prend le dernier choix <option>

une idée ?

@SolidSnake un très grand merci pour ton aide !

Merlin59910 a écrit :
super mon formulaire fonctionne presque

je remplie mon formulaire

quand je regarde en BDD le champs CatEnfant est toujours le même &quot;Vocabulaire&quot;

même si il apparais pas dans les options de la catégorie enfant

il prend bien en compte CatParent mais pas CatEnfant il prend le dernier choix &lt;option&gt;

une idée ?

ca pourais venir qu'il y est pas de Value="" dans <option> ?

Merlin59910 a écrit :
ca pourais venir qu'il y est pas de Value=&quot;&quot; dans &lt;option&gt; ?

C'est possible oui ( <- ironique ), s'il n'a pas de value, le formulaire ne te retourne pas de valeur, c'est aussi simple que ça

re bonjour,

idem avec mes value="remplis" je reste sur le dernier champ qui est vocabulaire

une idée ?

snif plus de réponse

Bonjour.

Ah pleure pas, va...

En fait c'est normal, tous tes select.ssCat porte le même nom ("CatEnfant") et vu qu'ils sont tous dans la même form, la valeur dans "CatEnfant" est écrasé à chaque fois avant de finir par le dernier "vocabulaire".

Ils font donc modifier ton HTML et ton JS.

Commence par mettre tous tes select.ssCat en dehors de ton form et dans une div unique cachée (peu importe où, je dirais vers la fin du body).
Puis ton JS, plutôt que d'afficher ou pas ta catégorie, va carrément cloner puis déplacer ton select dans ta form.

J'espère avoir été assez claire.

heuuuuuuu rien compris

et je comprend meme pas comment faire

j'ai compris que tout s'appel catEfant mais c'est normal puisque ce sont des categorie enfant

et que mon champs dans la BDD s'appel catenfant

Merlin59910 a écrit :
j'ai compris que tout s'appel catEfant mais c'est normal puisque ce sont des categorie enfant

Oui mais...

... Vu que tous tes select enfant sont dans ton form, ils sont TOUS pris en compte quand tu valides ton formulaire ! Donc un par un catEnfant prend la valeur sélectionnée de chaque select, et est écrasé à chaque fois, jusqu'au dernier, et donc catEnfant prend la value="vocabulaire".