View Full Version : [jQuery] Dynamic selectors

December 10th, 2008, 03:41 AM
I'm looking to implement a toggle for an input-driven form with over 40 elements.

Unfortunately, I don't know how to implement dynamic selectors in jQuery.

For example: I am pulling id's from a DB and am printing them as part of the class name for the toggle switch. When that toggle switch is clicked, I am looking for two corresponding divs to open or close.

Here is what I have:


Statically, this works great, but that '-0' could be any number, such as '-3423425464'. But how do I perform a dynamic selector so that '#activate-3423425464' toggles '#toggle1-3423425464' and '#toggle2-3423425464'?

December 10th, 2008, 04:00 AM
I found this article which is quite helpful: http://blog.paranoidferret.com/index.php/2008/12/02/jquery-tutorial-dynamic-sliding-panels/
but unfortunately my records are not nested in a child/parent format.


//Fixes an animation glitch caused by the
//div's dynamic height. Need to set the
//height style so the slide functions work
$(this).css("height", $(this).height() + "px");

//hook the mouseup events to each header

//find the body whose header was clicked
var body = $(this).parent().children("div.slideBody");

//slide the panel

Is there any way I can do this dynamically with numbers?

December 10th, 2008, 04:38 AM
How about something like this? (pseudocode):

ids = get list of IDs in document
regex = /^activate-([0-9]+)/
for id in ids {
if(id.match(regex)) {
the_number = id.match(regex).backreference(1)