Jquery Vérifier parent cases à cocher dans les ul li

J'ai un script qui va cocher et décocher tous les enfants des cases à cocher dans une liste imbriquée. Je suis maintenant essayer de l'obtenir afin que je puisse vérifier un niveau bas de case à cocher et il va vérifier tous les parents le font qu'au plus haut niveau. Voici un JSFiddle

<ul class="tree" id="tree">

    <li><input type="checkbox" name="account_settings" value="yes">Account Settings <!-- AND SHOULD CHECK HERE -->
        <ul>
            <li><input type="checkbox" name="one" value="one">AS One</li>
            <li><input type="checkbox" name="two" value="two">AS Two</li>
            <li><input type="checkbox" name="user_roles" value="user_roles">Users &amp; Roles <!-- SHOULD CHECK HERE -->
                <ul>
                    <li><input type="checkbox" name="user_role" value="add">Add</li>
                    <li><input type="checkbox" name="user_role" value="delete">Delete</li> <!-- CHECK HERE -->
                </ul>
            </li>
        </ul>
    </li>

    <li><input type="checkbox" name="rl_module" value="yes">RL Module</li>

    <li><input type="checkbox" name="rl_module" value="yes">Accounting
        <ul>
            <li><input type="checkbox" name="vat" value="yes">VAT</li>
            <li><input type="checkbox" name="bank_account" value="yes">Banking
                <ul>
                    <li><input type="checkbox" name="view" value="yes">View</li>
                    <li><input type="checkbox" name="crud" value="yes">CRUD</li>
                </ul>
            </li>
        </ul>
    </li>

</ul>

Et le javascript correspondant:

$('input[type=checkbox]').click(function(){

    //if is checked
    if($(this).is(':checked')){

        //check all children
        $(this).parent().find('li input[type=checkbox]').prop('checked', true);

        //check all parents
        $(this).parent().prev().prop('checked', true);

    } else {

        //uncheck all children
        $(this).parent().find('li input[type=checkbox]').prop('checked', false);

    }

});

Donc, si je comprends bien, vous voulez inverse de ce qu'il fait maintenant. Vous souhaitez vérifier tous les parents boîtes au moment de la vérification d'un enfant de la boîte.
Oui donc c'est comme un des privilèges de réglage. Vous avez besoin du parent d'être actif, mais pas le frère
Les enfants encore vérifiées, ou que la fonctionnalité devrait être supprimé?
Si vous cliquez sur Utilisateurs & les Rôles. Tous les enfants devraient être cochée ou décochée. La Comptabilité doit être cochée.
Lorsque vous décochez un enfant, faut-il décocher ses parents aussi? Et si il ne, faut-il décocher le parent que si c'est le dernier de la fratrie cochée, ou décochez tous ses frères et sœurs et les parents automatiquement? En gros, est-ce correct si les Paramètres de Compte est vérifié avec aucun de ses enfants cochée, ou il ne doit rester cochée si au moins un de ses enfants sont toujours vérifiées?
Si tous les enfants ne sont pas cochées, puis le parent direct doit être désactivée trop. Les Paramètres de compte va vérifier tous les enfants, mais si vous la décochez, de la plus basse enfant sauvegarder puis paramètres du Compte doit décocher quand les enfants ne sont pas sélectionnés.

InformationsquelleAutor Pierce McGeough | 2014-07-22

10

Il semble que vous voulez quelque chose de ce genre
```
$('input[type=checkbox]').click(function(){
    if(this.checked){ //if checked - check all parent checkboxes
        $(this).parents('li').children('input[type=checkbox]').prop('checked',true);
    }
    //children checkboxes depend on current checkbox
    $(this).parent().find('input[type=checkbox]').prop('checked',this.checked); 
});
```
VIOLON

Si vous voulez vérifier en haut et en bas de la hiérarchie - vous pouvez le faire comme ceci
```
$('input[type=checkbox]').click(function(){
    //children checkboxes depend on current checkbox
    $(this).next().find('input[type=checkbox]').prop('checked',this.checked);
    //go up the hierarchy - and check/uncheck depending on number of children checked/unchecked
    $(this).parents('ul').prev('input[type=checkbox]').prop('checked',function(){
        return $(this).next().find(':checked').length;
    });
});
```
VIOLON
- C'est la plus concise solution entièrement les fonctions correctement.
- Si je vérifie utilisateurs et des rôles, puis décochez la case, les paramètres de compte reste encore vérifié.
- Il n'est pas censé décochez les parents, car alors il aurait également à vérifier pour les frères et sœurs. "Si vous cliquez sur Utilisateurs & les Rôles. Tous les enfants devraient être cochée ou décochée. Les Comptables doivent aussi être vérifiés." Remarquez comment il ne veut pas dire que la Comptabilité doit être vérifiée et non trop.
- Je ne pense pas que l'OP réfléchi complètement. Je suis suppose qu'il a besoin d'une fratrie de vérifier.
- Pourquoi voulez-vous un enfant de décocher le parent au moment de la désactivation de la mère déjà fait de même et le reste des enfants?
- Si je coche et décoche utilisateurs et des rôles, pourquoi voudrais-je paramètre de compte à rester contrôlé?
- parce que vous pouvez également avoir Un, ou Deux, vérifié, pourquoi voulez-vous de ceux qui doivent être forcé décochée?
- D'en avoir Un ou Deux n'est pas ce que j'ai demandé.
- Parce que sinon, il n'y a aucun moyen d'avoir seulement "Paramètre du Compte" est cochée.
- C'est une excellente réponse, mais comment fait-il pour ce tarif quand il y a beaucoup de cases à cocher? Dire 400-500 des cases à cocher?
InformationsquelleAutor ᾠῗᵲᄐᶌ
6

Cela devrait le faire:
```
$('input[type=checkbox]').click(function () {
    $(this).parent().find('li input[type=checkbox]').prop('checked', $(this).is(':checked'));
    var sibs = false;
    $(this).closest('ul').children('li').each(function () {
        if($('input[type=checkbox]', this).is(':checked')) sibs=true;
    })
    $(this).parents('ul').prev().prop('checked', sibs);
});
```
jsFiddle exemple

Dernière mise à jour poignées en haut et en bas de la hiérarchie, et les frères et sœurs.
- Cette version n'a pas de décocher les enfants correctement, il décoche tous les parents, mais pas les enfants.
- Maintenant, si je vérifie le niveau supérieur d'un élément parent, il vérifie tous les enfants
- J'ai mis à jour ma réponse basée sur l'OP de récents changements, mais il semble toujours y avoir une certaine frange des cas que je ne suis pas certain que la façon dont les OP souhaitez gérer.
- vous cliquez sur Utilisateurs & les Rôles. Tous les enfants devraient être cochée ou décochée."
- maintenant, lorsque vous cochez la case "Bancaire" puis décochez la case "Afficher" les résultats sont incorrects
- Ah je vois, il y a encore quelques comportements inhabituels, mais je suppose que si c'est ce que l'OP veut...
- Maintenant que vous avez introduit un bug où si vous cochez la Comptabilité, puis décochez la case Afficher et CRUD, il maladroitement feuilles de TVA vérifié par lui-même. Vous aurez besoin de vérifier les frères et sœurs, à tous les niveaux jusqu'à ce qu'il atteint #tree.
- Quelque chose comme ceci est la façon dont vous auriez à gérer décochant les parents tout en regardant les frères et sœurs à chaque niveau: jsfiddle.net/Z82FR/3
InformationsquelleAutor j08691
2

Suffit d'utiliser jquery.parents(). Il est quelque peu similaire à find (), sauf qu'il recherche tous les parents. Quelque chose comme cela pourrait être proche de ce que vous êtes à la recherche pour:
```
$(this).parents('li').each(function() {
  $(this).children('input').prop('checked', true);
});
```
Voir http://api.jquery.com/parents/ pour plus d'informations.

EDIT: Bon, voici une solution qui fonctionne:

http://jsfiddle.net/3y3Pb/12/

EDIT2: Et plus simple solution ici:

http://jsfiddle.net/3y3Pb/14/
- Cela ne marche pas. Il ne cible la mère de li
- Oui, je sais. C'est pourquoi je l'ai mentionné qu'il pourrait être "proche" de ce que vous cherchez, parce que je me rends compte que exactement qui ne marche pas, désolé.
- Modifier pour $(this).parents('li').children('input[type="checkbox"]').prop('checked', true); comme ceci: jsfiddle.net/3y3Pb/13
- Bon, j'ai posté une solution de travail.
- Pourquoi utiliser .each()?
- Je suppose que vous n'avez pas besoin d', je préfère bien, car il rend les choses plus faciles à lire et à déboguer
InformationsquelleAutor Lochemage

Ont un JSFiddle: http://jsfiddle.net/3y3Pb/16/

Je voudrais recommander l'ajout d'un attribut parent pour les cases à cocher. Cet attribut parent fera référence à la mère de la case à cocher id de sorte que vous n'avez pas à vous soucier de votre modification de structure:

$('input type=[checkbox]').change(function () {
    $('#' + $(this).attr('parent')).prop('checked', this.checked);
});

Ex:

<input type="checkbox" name="account_settings" value="yes" id="as">Account Settings
    <ul>
        <li><input type="checkbox" name="one" value="one" parent="as" id="one">AS One</li>

InformationsquelleAutor deckeresq

0

Vous pouvez utiliser prevAll() aussi
J'ai le même problème. Dans mon cas, il y a plusieurs cases li avec des étiquettes, et chaque case au-dessus de la cible ont la classe parent (générés en js)
```
$(this).parents().prevAll('input:checkbox.parent').each(function () {
                       $(this).attr('checked', true);
                   });
```
InformationsquelleAutor Evgeny Gil

Vous devez vous connecter pour publier un commentaire.