Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery traversing - there has to be a better way than mine!
    text
    copied!<p>I'd like to know if someone has a better way to access the elements #type and #type_new based on my html:</p> <pre><code>&lt;tr&gt; &lt;th&gt;Type of Organization&lt;/th&gt; &lt;td id="toggle"&gt; &lt;select name="type" id="type"&gt; &lt;option&gt;Church&lt;/option&gt; &lt;option&gt;College&lt;/option&gt; &lt;option&gt;Theatre&lt;/option&gt; &lt;/select&gt; &lt;input name="type_new" id="type_new" type="text" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;th&gt;&amp;nbsp;&lt;/th&gt; &lt;td&gt;&lt;a class="toggle" id="type"&gt;&lt;small&gt;Add New Type&lt;/small&gt;&lt;/a&gt;&lt;/td&gt; &lt;/tr&gt; </code></pre> <p>Here is my javascript:</p> <pre><code>$("a.toggle").unbind('click').click(function(){ $.prev = $(this).parents().parent().prev().find("td#toggle"); $.select = $.prev.find("#type"); $.textbox = $.prev.find("#type_new"); if($.textbox.is(':visible')==true) $(this).find("small").html("Add New Type"); else $(this).find("small").html("Choose From Exisiting Types"); $.select.toggle(); $.textbox.toggle().val(""); }); </code></pre> <p>I know there are other ways to lay out the html to make the javascript easier but surely someone has a good way based on my current html.</p> <p>It's probably worth noting that the reason I'm not just referencing by ID or CLASS is I'm also generating more of these on the fly with an an ajax .load and all elements will have the same id's and classes. Why not use indexes you might ask? Well I've been there and done that. I'd have to actually use more code to re-bind the click events to include all new elements. I'm going for the simplest way possible here.</p> <p>Thanks!</p> <p>UPDATE: I want to stress the fact that I'm adding identical elements further down the page with an ajax .load. They'll have different element names for $_POST reasons but I want my javascript function to handle every instance as they appear. If I reference only by ID it will update all of the elements all the way down the page.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload