How to get dynamically generated ID by Class Name
Hi all, hoping this is the right forum to post in...
I'm stumped on a jQuery related development task. I'm using jQuery in a SharePoint Web Part...The web part pulls data from a list and displays each item as a link button. When the link button is clicked it uses the jQuery-UI to display the body of the list item in a dialog box. I have this working perfectly when all of the class names are hardcoded. So in this code dialog0 is the class name for the body of the first article. newTitle0 is the linkbutton so they correspond 1:1 (and so on Dialog1, newsTitle1 etc..)
- $('.dialog0').dialog({
height: 500,
width: 990,
autoOpen: false,
show: 'blind',
hide: 'fold'
});
$('.newsTitle0').click(function() {
$('.dialog0').dialog('open');
return false;
});
Ex:
---------------------------------
News Story 1 (when clicked the body pops up using the Dialog box from jQuery-UI, body is hidden)
News Story 2
--------------------------------
Problem is, when I have more than 1 instance of the web part on a page, because they use the same class names (2nd web part would also use Dialog0, newTitle0), if I click on an item in one web part, the item with the same class name opens in the other web part as well.
I've implemented it so each item now has a unique ID but I don't know where to go from here, so multiple instances of the web part can be on the page, and have the jQuery know which body to display when a link is clicked.
I know that was probably not the clearest, its hard to explain in text. Hope someone can assist me with finding a solution.