Access our premium support and let us know your problems, we will help you solve them.

0
No products in the cart.
  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #11052
    blankjohn-smith
    Participant

    I have a <div> that has many other <div>s within it, each at a different nesting level. Rather than give every child <div> an identifier, I rather just give the root <div> the identifier. Here’s an example:

    <div class="a" id="a5">
      <div class="b">
        <div class="c">
          <a class="d">
          </a>
        </div>
      </div>
    </div>
    

    If I write a function in jQuery to respond to class d and I want to find the ID for its parent, class a, how would I do this?

    I cannot simply do $('.a').attr('id');, because there are multiple class as. I could find its parent’s parent’s parent’s ID but that seems of poor design, slow, and not very polymorphic (I would have to write different code for finding the ID for class c).

    #11057
    blankdrew-noakes
    Participant

    Pass a selector to the jQuery parents function:

    d.parents('.a').attr('id')
    

    EDIT Hmm, actually Slaks’s answer is superior if you only want the closest ancestor that matches your selector.

    #11058
    blankslaks
    Participant

    Assuming that this is .d, you can write

    $(this).closest('.a');
    

    The closest method returns the innermost parent of your element that matches the selector.

    #11055
    blankamr-elgarhy
    Participant

    You can use parents() to get all parents with the given selector.

    Description: Get the ancestors of each
    element in the current set of matched
    elements, optionally filtered by a
    selector.

    But parent() will get just the first parent of the element.

    Description: Get the parent of each
    element in the current set of matched
    elements, optionally filtered by a
    selector.

    jQuery parent() vs. parents()

    And there is .parentsUntil() which I think will be the best.

    Description: Get the ancestors of each
    element in the current set of matched
    elements, up to but not including the
    element matched by the selector.

    #11053
    blankjai3232
    Participant

    Use .parentsUntil()

    $(".d").parentsUntil(".a");
    
    #11056
    blankanjana-silva
    Participant

    Extracted from @Resord’s comments above. This one worked for me and more closely inclined with the question.

    $(this).parent().closest('.a');
    

    Thanks

    #11054
    blankhuy
    Participant
    <div id="412412412" class="input-group date">
         <div class="input-group-prepend">
              <button class="btn btn-danger" type="button">Button Click</button>
              <input type="text" class="form-control" value="">
          </div>
    </div>
    

    In my situation, i use this code:

    $(this).parent().closest('.date').attr('id')
    

    Hope this help someone.

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.