CODEWITHSUNDEEP
javascripthtmlpolymer
physicsboy
physicsboy

Reputation: 6316

How to check if parent element contains a certain tag? - Polymer

I have code split into different files as such (simplified version):

admin-page.html

<paper-tabs selected={{selected}} attr-for-selecton="name">
    <paper-tab name="User">User</paper-tab>
    ...
    ...
</paper-tabs>
<iron-pages selected={{selected}} attr-for-selection="name">
    <admin-user-page name="User"></admin-user-page>
    ...
    ...
</iron-pages>

admin-user-page.html

<!-- general page content... -->

// Javascript
//--------------
// here I want to have an if statement for whether the parent (user-page.html) 
// contains the <paper-tabs> tag.

Bearing in mind that I'm after a PolymerJS solution to this, is there any way of detecting whether paper-tabs is present in admin-page.html from within the admin-user-page.html file?

Upvotes: 0

Views: 938

Answers (2)

ᴍᴇʜᴏᴠ
ᴍᴇʜᴏᴠ

Reputation: 5256

Try closest(selectors):

this.closest('paper-tabs')

Upvotes: 0

Simon Sch&#228;rer
Simon Sch&#228;rer

Reputation: 602

Well, within your child component (admin-user-page) you could use this.parentNode to access your parent component (admin-page) and then check whether there is a paper-tabs tag. So it would look something like this: 

Polymer('admin-user-page', {
  ready: function(){
     // you have to use parentNode twice
     // this.parentNode is the iron-pages
     // this.parentNode.parentNode is the admin-page
     if( this.parentNode.parentNode.querySelector('paper-tabs') ){
       // paper-tabs tag exists in parent
     }
  }
});

It is not an elegant solution though. But I hope that answers your question.

Upvotes: 2

Related Questions