Hey all, I found a solution to my issue. All I needed to do was traverse the DOM a bit within my .click function. For those of you interested/ having the same issues, here's the solution -
http://brian-talbot.com/inventingroom/flagcomments2/ -- Brian On Apr 14, 5:43 pm, Brian Talbot <[EMAIL PROTECTED]> wrote: > Hi All, > > I was wondering if anyone had any insight into an issue I'm having > when using JQuery to show/hide a series of elements on a page. I > currently have a set of comments (to be placed in a larger page) and > along with each comment a form is needed to allow users to flag an > individual comment. > > I've tried to create this page with accessibility in mind so there is > one unique form (with its own ID) for each comment (also with its own > ID). You can view a sample page without any styling here > -http://brian-talbot.com/inventingroom/flagcomments/ > > The interaction I'd like to have is when a user clicks on the "Flag > This Comment" link (that I am inserting into each comment's <div> > using JQuery) The form for the specific comment the user wants to flag > (hidden by default using JQuery) toggles its visibility to visible and > allows the user to enter information. > > What I have now doesn't account for the specific comment a user > selects and expands all of the comments instead :o( Also, I'd love to > be able to do the following: > > 1) Change the text of the "Flag This Comment" toggle link to display > something else once the form is expanded for a particular comment - > perhaps to something like "Cancel Flagging This Comment". > > 2) Dynamically add an href attribute to the "Flag This Comment" toggle > link that provides an anchor link down to the corresponding flag form > (i.e. <a class="button button-flag flag-toggle" href="#flag- > comment001"><span>Flag This Comment</span></a> > > If anyone has any ideas and wouldn't mind sharing, it would be much > appreciated. Thanks!
