Manipulation of parents and siblings JQUERY

Question

Manipulation of parents and siblings JQUERY

Navigation

#1 by (0 votes)

1

I have a question in JQuery. I have the following code, example:

<div class="col-sm-2">
    <div class="md-checkbox">
        <input type="checkbox" id="checkbox1" class="md-check">
    </div>
</div>

<div class="col-sm-2" hidden="hidden">
    <input type="text" class="form-control" id="form_control_1">
</div>

<div class="col-sm-2" hidden="hidden">
    <input type="text" class="form-control" id="form_control_2">
</div>

<div class="col-sm-2" hidden="hidden">
    <input type="text" class="form-control" id="form_control_3">
</div>

What I need to do is that when someone checks checkbox1 , it should show the inputs of the divs that have the hidden attribute.

In this case it would be something like climbing up to the parent of the checkbox , then up to the parent of that div , then set as visible the neighboring divs .

How can I do this?

javascript jquery twitter-bootstrap

asked by anonymous 30.09.2015 / 16:23

1 answer

Error opening network link Identify corners in Google Maps

score 0 · Accepted Answer

Something like this?

$(document).ready(function() {
    $("#checkbox1").click(function(){
        var checked = $(this).is(":checked");
        if(checked)
            $(this).parent().parent().siblings("div[hidden=hidden]").each(function(i, div) {
                $(div).removeAttr("hidden").show();
            });
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="col-sm-2">
    <div class="md-checkbox">
        <input type="checkbox" id="checkbox1" class="md-check">
    </div>
</div>

<div class="col-sm-2" hidden="hidden">
    <input type="text" class="form-control" id="form_control_1">
</div>

<div class="col-sm-2" hidden="hidden">
    <input type="text" class="form-control" id="form_control_2">
</div>

<div class="col-sm-2" hidden="hidden">
    <input type="text" class="form-control" id="form_control_3">
</div>

This is a way to do it, just as you described it: from the checkbox, you get the parent of the parent and then the nodes of the same level that have the hidden attribute. For each one, the attribute is removed and made visible.