I'm not sure why you wouldn't use the appropriate id for the data-target,
then you can use
this.$[sender.dataset.target].classList.add('active')....or something.However, somewhat tangentially, I have to wonder why you aren't using querySelectorAll() since there are several input elements in your #searchContainer, and why not use this.$.searchContainer directly. ...and this.this.$ doesn't look right at all (copy/paste error?) HTH Max. On Mon Jan 05 2015 at 21:30:38 Niko Lang <[email protected]> wrote: > I just worked through the tutorial and I am building my first own element. > And I am missing some DOM-Scripting Functions I know from Prototype and > jQuery that made my life very easy. But maybe my methods are just not > right. This is what I have done so far: > > <polymer-element name="search-field"> > <template> > > <div id="searchField"> > <ul id="searchCategories"> > <li><a id="search-categories-text" data-target="text" on-click > ="{{categoryClick}}">Text</a></li> > <li><a id="search-categories-videos" data-target="videos" > on-click="{{categoryClick}}">Videos</a></li> > <li><a id="search-categories-audio" data-target="audio" > on-click="{{categoryClick}}">Audio</a></li> > </ul> > <div id="searchContainer"> > <input id="searchText" type="text" /> > <input id="searchVideos" type="text" /> > <input id="searchAudio" type="text" /> > </div> > </div> > > </template> > <script> > Polymer({ > ready: function() { > > }, > categoryClick: function(event, detail, sender) { > console.log(sender.dataset.target); > console.log(this.$.searchField.querySelector('#searchContainer > input')); > this.this.$.searchField.querySelector('#searchContainer input' > ); > } > }); > </script> > </polymer-element> > > What I want to do is to set an active class to the bottom input-fields > when one of the above links are clicked. On jQuery I would just observe a > link and deactivate all input fields and activate the one input field I > want to have. But I am not sure how to do it without jQuery. I could just > use all the native javascript functions with loops etc but is there > anything polymer can offer to make things easier? > > Follow Polymer on Google+: plus.google.com/107187849809354688692 > --- > You received this message because you are subscribed to the Google Groups > "Polymer" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To view this discussion on the web visit https://groups.google.com/d/ > msgid/polymer-dev/f4fae7e7-ec08-46f8-88b3-78f8f08f0ca2%40googlegroups.com > <https://groups.google.com/d/msgid/polymer-dev/f4fae7e7-ec08-46f8-88b3-78f8f08f0ca2%40googlegroups.com?utm_medium=email&utm_source=footer> > . > For more options, visit https://groups.google.com/d/optout. > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CAMZCrPiKHsYQixX7aKrOXHFKxmu-iVET3hfO0EwBfzGrFv6ZHg%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
