Activation d'un bouton par click sur une checkbox

Version imprimable

Bonjour,

Je suis actuellement sur un projet jquery-mobile (avec un serveur applicatif javaEE) : j'aimerais savoir si il est possible que certain champ soit visible ou invisible par l'appui sur une checkbox.

Mon code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div data-role="content">	             
    <ul data-role="listview" data-split-icon="gear">
        <li>
            <a href="<s:property value="%{getText('Welcome.url.facebook')}"/>" data-inline="true"   data-ajax="false">
                <img src="../images/facebook_logo100px100.png" style="text-align: center;"/>
                <h3>Facebook</h3>
                <p> <s:property value="%{getText('Welcome.facebook')}"/> </p>
            </a>                  
        </li>
        <li>
            <a href="<s:property value="%{getText('Welcome.url.twitter')}"/>" data-inline="true"  data-ajax="false" >
                <img src="../images/twitter-logo-1100px100.png" style="text-align: center;"/>
                <h3>Twitter</h3>
                <p>  <s:property value="%{getText('Welcome.twitter')}"/></p>
            </a>
        </li>
    </ul>
    <div data-role="fieldcontain">
        <fieldset data-role="controlgroup">
            <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" />
            <label for="checkbox-1"><s:property value="%{getText('Welcome.generaltermofuser')}"/></label>
        </fieldset>
    </div>
</div>

J'aimerais que ma checkbox puisse contrôler ma liste view afin que l'utilisateur ne puisse pas clicker sur la list view temps qu'il na pas appuyé sur la checkbox
Car ma checkbox représente les conditions générales d'utilisation.

Merci de votre aide.

bon déjà j'ai trouvé comment avoir l'événement d'appui sur la checkbox :
Code:

1 2 3 4 5 6 $(document).ready(function() { // <-- ensures the DOM is ready $("input[type='checkbox-1']").attr("checked",true).checkboxradio("refresh"); if($('input[name=checkbox-1]').attr('checked') != true){ alert("checkbox is not Checked"); } });
et mon bloque de jquery mobile :
Code:

1 2 3 4 5 6 <div data-role="fieldcontain"> <fieldset data-role="controlgroup"> <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" /> <label for="checkbox-1"><s:property value="%{getText('Welcome.generaltermofuser')}"/></label> </fieldset> </div>
Maintenant j'aimerais comprendre pourquoi l’alerte n’apparaît qu'au rafraîchissement de la page avec F5 et n’apparaît pas lorsque je clique sur le bouton. Si quelqu'un a une idée qu'il me fasse signe le code ci dessous fonctionne aussi :
Code:

1 2 $(document).on('pageinit', function() { // <-- ensures the DOM is ready // a la place de $(document).ready(function() {
J'ai trouver ce code la sur le net mais il semble ne pas marcher dans mon cas :
Code:

1 2 3 4 $(".validateonchange").live("change", function() { alert("My checked attribute is : " + $(this).prop('checked')); }); });

03/05/2013, 11h30
Bovino

Apparemment, tu ne comprends pas tout ce que tu essayes de faire et en particulier, tu ne comprends pas les sélecteurs que tu utilises...

Code:

$("input[type='checkbox-1']")

Tu es vraiment sûr que checkbox-1 est un type valide qui est présent dans ton code ?

Code:

$(".validateonchange")

Je ne vois nulle part d'élément ayant la classe validateonchange.

Et pour finir, .live() est déprécié...

Bonjour,

Citation:

Tu es vraiment sûr que checkbox-1 est un type valide qui est présent dans ton code ?

Oui c'est bien valide et ca marche :

Code:

<input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" />

Ca marche bien. C'étais le 'ui-disabled' que je ne connaissais pas je laisse le code au cas ou cela intéresse quelqu'un .
Code:

1 2 3 4 5 6 7 8 9 10 11 $('#listview').addClass('ui-disabled'); if($('#checkbox-1').click(function(check){ if($('#checkbox-1').prop('checked') == true){ $('#listview').removeClass('ui-disabled'); // alert("it s Work " + $('#checkbox-1').prop('checked') ); } if($('#checkbox-1').prop('checked')!= true){ $('#listview').addClass('ui-disabled'); // alert("it s Work " + $('#checkbox-1').prop('checked') ); } }));
Cordialement