Slide toggle avec checkbox

Version imprimable

Bonjour,
J'ai un léger soucis avec mon slideToggle en effet lorsque je veux cliquer sur une de mes checkbox , j'aimerais que un contenue apparaisse .
Mon code JS marche nickel sur un slideToggle avec un texte .
Voici le code HTML

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="sublist">
    <div class="row">
        <div class="col-md-4">
            <?php echo $this->Form->input('metier[]','BanqueFinance',array('type'=> 'checkbox'));?> // ce sont mes checkbox
            <div class="subsublist">TEST</div>
            <?php echo $this->Form->input('metier[]','Multinationalindustrie',array('type'=> 'checkbox'));?>
            <div class="subsublist">TEST</div>
            <?php echo $this->Form->input('metier[]','Horlogerie',array('type'=> 'checkbox'));?>
            <?php echo $this->Form->input('metier[]','Immobilier',array('type'=> 'checkbox'));?>
            <?php echo $this->Form->input('metier[]','Négociation international',array('type'=> 'checkbox'));?>
            <?php echo $this->Form->input('metier[]','Autre',array('type'=> 'checkbox'));?>
        </div>
    </div>
</div>

Voici le code JS

Code:

1
2
3
4
5
6
$('.subsublist').hide();
$('.sublist').change(function() {
    jObj = $( this ).next( '.subsublist' ).eq(0);
    $( '.subsublist' ).not( jObj ).slideUp( "slow" );
    jObj.slideToggle( 800 );
});

26/01/2015, 18h01
numew

C'est au checkbox qu'il faut donner la class ".sublist" pour que ça fonctionne.

hello ,
merci pour la réponse , mais j'utilise le bootstrap de twitter donc je dois laisser mes classes checkbox :/
voici mon code source

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="sublist">
	<div class="row">
		<div class="col-md-4">
			<div class="clearfix">
                                <div class="checkbox">
                                        <label>
                                           <input type="checkbox" id="inputmetier[]" name="metier[]" value="BanqueFinance">BanqueFinance
                                        </label>
                                </div>
                        </div>				
                <div class="subsublist">
                TEST
        </div>

26/01/2015, 22h58
boogiball

Re hello, bon j'ai mit la classe "clearfix" et ca fonctionne ! Seul soucis c'est que j'aimerais que mon contenu soit afficher pendant que la case est cocher ... Il faut que j'utilise :checked ? merci encore

Je voulais dire de mettre la classe vraiment sur l'input checkbox

Code:

<input class=".sublist" type="checkbox" id="inputmetier[]" name="metier[]" value="BanqueFinance">BanqueFinance

Oui pour le js quelque chose comme ça fonctionne :
Code:

1 2 3 4 5 6 7 8 $('.subsublist').hide(); $('.sublist').change(function () { if($(this).prop('checked')){ $(this).next('.subsublist').eq(0).show(); }else{ $(this).next('.subsublist').eq(0).hide(); } });